text-decoration：[ text-decoration-line ] || [ text-decoration-style ] || [ text-decoration-color ]
Posted 苦逼程序瘦子
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了text-decoration：[ text-decoration-line ] || [ text-decoration-style ] || [ text-decoration-color ] 相关的知识，希望对你有一定的参考价值。
css3中字体装饰，多样化的界面效果，：
[ text-decoration-line ]：指定文本装饰的种类。相当于CSS2.1的 text-decoration 属性，
可取值：none | underline | overline | line-through | blink （Firefox1.0及Opera4.0开始支持blink，其它浏览器尚不支持）
[ text-decoration-style ]：指定文本装饰的样式。[ text-decoration-color ]：指定文本装饰的颜色。 ：下面请看实例代码：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>text-decoration_CSS参考手册_web前端开发参考手册系列</title>
<meta name="author" content="Joy Du(飘零雾雨), [email protected], www.doyoe.com" />
<style>
.test li{margin-top:10px;}
.test .none{text-decoration:none;}
.test .underline{text-decoration:underline;}
.test .overline{text-decoration:overline;}
.test .line-through{text-decoration:line-through;}
.test .blink{text-decoration:blink;}
.test .text-decoration-css3{
text-decoration:#f00 dotted underline;
}
</style>
</head>
<body>
<ul class="test">
<li class="none">无装饰文字</li>
<li class="underline">带下划线文字</li>
<li class="overline">带上划线文字</li>
<li class="line-through">带贯穿线文字</li>
<li class="blink">带闪烁文字</li>
<li class="text-decoration-css3">如果你的浏览器支持text-decoration在CSS3下的改变，将会看到本行文字有一条红色的下划虚线</li>
</ul>
</body>
</html>
以上是关于text-decoration：[ text-decoration-line ] || [ text-decoration-style ] || [ text-decoration-color ] 的主要内容，如果未能解决你的问题，请参考以下文章
解决文字和text-decoration:underline下划线重叠问题
对超链接使用“border-bottom”而不是“text-decoration”——它在语义上是不是正确？