text-decoration-line 屬性/樣式/取值/語法/格式寫法/簡寫/用法[CSS教程手冊]

語法：

text-decoration-line：none | [ underline || overline || line-through || blink ]

默認(rèn)值：none

適用于：所有元素

繼承性：無

動(dòng)畫性：否

計(jì)算值：指定的值

取值：

none：: 指定文字無裝飾
underline：: 指定文字的裝飾是下劃線
overline：: 指定文字的裝飾是上劃線
line-through：: 指定文字的裝飾是貫穿線
blink：: 指定文字的裝飾是閃爍。

說明：

檢索或設(shè)置對象中的文本裝飾線條的位置。

相當(dāng)于CSS2.1的 <' text-decoration '> 屬性
需要注意的是大部分瀏覽器都不支持blink值，因?yàn)橐?guī)范允許用戶代理忽略該效果；
對應(yīng)的腳本特性為textDecorationLine。

兼容性：

淺綠 = 支持
紅色 = 不支持
粉色 = 部分支持

Values	IE	Firefox	Chrome	Safari	Opera	iOS Safari	Android Browser	Android Chrome
Basic Support	6.0-11.0	2.0-5.0	4.0-45.0	6.0-7.0	15.0-29.0	6.0-7.1	2.1-4.4.4	18.0-42.0
		6.0-35.0^-moz-		7.1-8.0^-webkit-		8.0-8.3^-webkit-
		36.0+		7.1-8.0^-webkit-		8.0-8.3^-webkit-

示例：

<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8" />
<title>text-decoration-line_CSS參考手冊_web前端開發(fā)參考手冊系列【CSS在線手冊-網(wǎng)站設(shè)計(jì)教程參考資料】</title>
<meta name="author" content="易網(wǎng),網(wǎng)站設(shè)計(jì),網(wǎng)站制作,網(wǎng)站建設(shè),www.dgyx668.com" />
<style>
.test li{margin-top:10px;}
.test li:nth-child(1){
	-webkit-text-decoration-line:none;
    -moz-text-decoration-line:none;
    text-decoration-line:none;
}
.test li:nth-child(2){
    -webkit-text-decoration-line:underline;
    -moz-text-decoration-line:underline;
    text-decoration-line:underline;
}
.test li:nth-child(3){
    -webkit-text-decoration-line:overline;
    -moz-text-decoration-line:overline;
    text-decoration-line:overline;
}
.test li:nth-child(4){
    -webkit-text-decoration-line:line-through;
    -moz-text-decoration-line:line-through;
    text-decoration-line:line-through;
}
.test li:nth-child(5){
    -webkit-text-decoration-line:blink;
    -moz-text-decoration-line:blink;
    text-decoration-line:blink;
}
</style>
</head>
<body>
<ul class="test">
    <li>沒有文本裝飾</li>
    <li>文本帶有下劃線裝飾</li>
    <li>文本帶有上劃線裝飾</li>
    <li>文本帶有貫穿線裝飾</li>
    <li>文本帶有閃爍裝飾</li>
</ul>
</body>
</html>