text-decoration

設定值以指出是否要將物件中的文字加上刪除線、頂線或底線裝飾。

語法

{ text-decoration: sDecoration }

可能的值

sDecoration

指定下列其中一個值的字串:

none

預設值。不裝飾文字。

line-through

在文字上繪製貫穿文字的線條。

overline

在文字上方加上線條。

underline

將文字加上底線。

此屬性的預設值為 none ,而且不是繼承屬性。

備註

用於下列標籤時有不同的預設值:

  • 當與 HREF、U 及 INS 元素搭配使用時,A 元素的預設值為 underline

  • STRIKE、S 及 DEL 元素的預設值為 line-through

如果將 none 值放置在值的結尾,則會清除所有的值。例如,設定 {text-decoration: underline overline blink none} 會導致所有宣告均無法呈現。

如果物件沒有文字 (如 HTML 中的 IMG 物件) 或為空白物件 (如 <EM></EM>),則此屬性不具有任何效果。

如果在 BODY 物件上將 text-decoration 屬性設為 none ,A 物件仍會加上底線。若要移除 A 物件的底線,請將樣式設為內嵌或在全域樣式表中將 a 當作選取器。

針對區塊元素指定 text-decoration 屬性會影響所有內嵌子元素。如果針對內嵌元素指定此屬性,或此屬性影響了內嵌元素,則該元素產生的方塊都會受到影響。

範例

下列範例使用 text-decoration 屬性來裝飾物件內的文字。此範例使用內嵌樣式表來繪製貫穿物件內文字的線條:

<div style="text-decoration:line-through">
.
.
.
</div>

此範例示範 text-decoration 不可繼承。子項 (SPAN 元素) 看似從父項 (DIV 元素) 繼承樣式,但其實並非如此:

<html>
<head><style>
    div{color:red; text-decoration:underline;}
    span{color:blue; text-decoration:none;}
</style>
</head>
<body>
<div>This div has text decoration set to underline <span>, but this span
        has it set to none. </span> The div continues here.</div>
</body>
</html>

標準資訊

您可以在 Cascading Style Sheets (CSS), Level 1 (CSS1) (階層式樣式表 (CSS) 層級 1 (CSS1)) Ee371276.xtlink_newWindow(zh-tw,Expression.40).png 找到此屬性的定義。

適用範圍

a, address, b, big, blockquote, body, button, caption, center, cite, code, col, colgroup, custom, dd, defaults, dfn, div, dl, dt, em, fieldset, form, hn, html, i, input type=button, input type=file, input type=password, input type=radio, input type=reset, input type=submit, input type=text, li, ol, p, s, select, span, sub, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, var, xmp

另請參閱

概念

text-decoration-color
text-decoration-line
text-decoration-skip
text-decoration-style
text-underline-position
text-outline
text-shadow