精品国产免费久久久久久蜜桃,八戒八戒神马影院www在线,伊人不卡久久大香线蕉综合影院

技術(shù)頻道 - html技術(shù)

[示例演示] text-decoration在文字下面加波浪線/上面加直線

作者:admin 時(shí)間:2022-6-20 11:4:14 瀏覽:

本文演示介紹在文字下面加波浪線，在文字上面加直線等各種text-decoration屬性。

文字下面加波浪線

我們可以使用下面的屬性在文字下面加上波浪線。

text-decoration: underline wavy;

結(jié)果

設(shè)置波浪線顏色

設(shè)置波浪線顏色可以使用下面的語(yǔ)句。

text-decoration: underline wavy #0000ff;

結(jié)果

text-decoration的其他屬性

text-decoration 這個(gè) CSS 屬性是用于設(shè)置文本的修飾線外觀的（下劃線、上劃線、貫穿線/刪除線或閃爍）。

注意：文本修飾屬性會(huì)延伸到子元素。這意味著如果父元素指定了文本修飾屬性，子元素則不能將其刪除。例如，在如下標(biāo)記中 This text has some emphasized words in it.，應(yīng)用樣式p { text-decoration: underline } 會(huì)對(duì)整個(gè)段落添加下劃線，此時(shí)再添加樣式 em { text-decoration: none } 則不會(huì)引起任何改變，整個(gè)段落仍然有下劃線修飾。然而，新加樣式 em { text-decoration: overline } 則會(huì)在標(biāo)記的文字上再添加上這種 overline 樣式。overline 是在文字上方加橫線的樣式。

語(yǔ)法

text-decoration 屬性是一種簡(jiǎn)寫屬性，并且可以使用普通屬性三個(gè)值中的任何一個(gè)。普通屬性如下：text-decoration-line，text-decoration-color和text-decoration-style。

值

text-decoration-line

文本修飾的位置，如下劃線underline，刪除線line-through

text-decoration-color

文本修飾的顏色

text-decoration-style

文本修飾的樣式，如波浪線wavy實(shí)線solid虛線dashed

text-decoration-thickness

文本修飾線的粗細(xì)

語(yǔ)法形式

<'text-decoration-line'> || <'text-decoration-style'> || <'text-decoration-color'> || <'text-decoration-thickness'>

示例

<p class="under">文字有下橫線</p>
<p class="over">文字上面有波浪線</p>
<p class="line">文字有一條刪除線</p>
<p>這個(gè) <a class="plain" href="#">鏈接沒(méi)有下橫線</a></p>
<p class="underover">文字下面 <em>和</em> 上面都有虛線</p>
<p class="blink">文字可能會(huì)閃爍，取決于你的瀏覽器</p>

.under {
  text-decoration: underline red;
}

.over {
  text-decoration: wavy overline lime;
}

.line {
  text-decoration: line-through;
}

.plain {
  text-decoration: none;
}

.underover {
  text-decoration: dashed underline overline;
}

.blink {
  text-decoration: blink;
}