CSS3中,我們可以使用text-decoration屬性來為文字添加中劃線。具體來說,text-decoration可以設定如下值:
text-decoration: none; /* 默認值,不設置任何裝飾 */ text-decoration: underline; /* 下劃線 */ text-decoration: overline; /* 上劃線 */ text-decoration: line-through; /* 中劃線 */ text-decoration: blink; /* 閃爍線 */ text-decoration: inherit; /* 繼承父元素的 textDecoration 值 */
要設置中劃線,我們只需要將text-decoration的屬性值設置為line-through即可:
text-decoration: line-through;
當然,我們也可以通過縮寫方式來設置text-decoration屬性:
text-decoration: none solid rgb(0, 0, 0); /* 不設置任何裝飾 */ text-decoration: underline dotted rgb(0, 0, 0); /* 下劃線+點狀虛線 */ text-decoration: overline double rgb(0, 0, 0); /* 上劃線+雙劃線 */ text-decoration: line-through wavy rgb(0, 0, 0); /* 中劃線+波浪線 */
需要注意的是,text-decoration屬性不僅僅可以應用于文本,還可以應用于鏈接的裝飾。比如:
a { text-decoration: none; /* 去掉鏈接下劃線 */ } a:hover { text-decoration: underline; /* 鼠標懸浮時出現下劃線 */ }