css如何实现文本装饰

这篇文章给大家分享的是有关css如何实现文本装饰的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

创新互联公司是专业的新荣网站建设公司,新荣接单;提供成都网站建设、做网站,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行新荣网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!

 text-decoration 属性,这是一个很有意思的属性,它提供了不少颇为风趣的行为。

text-decoration 有 5 个值:

  • none

  • underline

  • overline

  • line-through

  • blink

不出所料,underline 会对元素加下划线,就像 HTML 中的 U 元素一样。overline 的感召恰好相反,可能在文本的顶端画一个上划线。值 line-through 则在文本中间画一个贯串线,等价于 HTML 中的 S 和 strike 元素。blink 会让文本闪烁,相同于 Netscape 赞成的颇招非议的 blink 符号。

none 值会关闭原本应用到一个元素上的一切装璜。通常,无装饰的文本是默认轮廓,但也不老是多么。好比,链接默认地会有下划线。如果您盼愿去掉超链接的下划线,或许使用以下 CSS 来做到这一点:

a {text-decoration: none;}

当心:假定显式地用何等一个划定规矩去掉链接的下划线,那么锚与畸形文本之间在视觉上的仅有差别便是色调(最多默认是这样的,不外也不克不及纯粹担保其色采确定有甄别)。

还梗概在一个规则中分散多种装潢。要是祈望一切超链接既有下划线,又有上划线,则规则如下:

a:link a:visited {text-decoration: underline overline;}

无非要留意的是,要是两个不同的装潢都与对抗元素成家,胜出规则的值会彻底经办另外一个值。请思虑以下的规则:

h3.stricken {text-decoration: line-through;}
h3 {text-decoration: underline overline;}

对付给定的划定规矩,悉数 class 为 stricken 的 h3 元素都只需一个领悟线装璜,而不有下划线和上划线,因为 text-decoration 值会革新而不是积累起来。

感谢各位的阅读!关于“css如何实现文本装饰”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


文章题目:css如何实现文本装饰
标题网址:http://cdiso.cn/article/pdcopp.html

其他资讯