前端文字布局(前端修饰文本使用text-decoration时)
点击上方蓝字关注“小郑搞码事”,每天都能学到知识,搞懂一个问题!
说到text-decoration,用的最多的地方,可能就是a标签了,用来将a标签文本的下划线去掉,我们通常设置:
a{text-decoration:none}
有没有很熟悉的样子,然而text-decoration其实是三个属性的缩写,如下所示:
text-decoration-line
text-decoration-color
text-decoration-style
非常有意思,下面我带大家来一一看一下:
一、看一下用法1、text-decoration-line
定义:用来规定文本修饰要使用的线条类型。
取值:大概就是:none,underline,line-through(规定文本中间将显示一条线)等等。
兼容性:看下面图吧
咋一看,也还可以,firefox和Chrome,safari都还蛮好的。
就是按着上面概念,将text-decoration分三个属性来写。看一下展示结果:
没有出乎意料之外,完毕了。接下来在总结里说两个使用时的注意事项。
简单总结一下:
注意几个问题:
1、从概念上看,这个属性是用于文本修饰,如P,h1~h4等,不仅是A元素。
2、这三种属性可以简写,如:text-decoration: underline red solid。
,
免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com