明輝手游網(wǎng)中心：是一個(gè)免費(fèi)提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺！

如何使用text-decoration

發(fā)表時(shí)間：2024-05-09 來源：明輝站整理相關(guān)軟件相關(guān)文章人氣：

[摘要]我們在網(wǎng)頁里常常會使用使用CSS代碼來對象文字內(nèi)容加上下劃線。那么我們就要用到text-decoration了 ，如何使用呢？今天我們給大家好好介紹一下。使用CSS屬性單詞：text-decoration : none underline blink overline li...
我們在網(wǎng)頁里常常會使用使用CSS代碼來對象文字內(nèi)容加上下劃線。那么我們就要用到text-decoration了 ，如何使用呢？今天我們給大家好好介紹一下。

使用CSS屬性單詞：

text-decoration : none underline blink overline line-through

text-decoration下劃線CSS單詞值參數(shù)：

none : 　無裝飾

blink : 　閃爍

underline : 　下劃線

line-through : 　貫穿線

overline : 　上劃線

text-decoration:none 無裝飾，通常對html下劃線標(biāo)簽去掉下劃線樣式

text-decoration:underline 下劃線樣式

text-decoration:line-through 刪除線樣式-貫穿線樣式

text-decoration:overline 上劃線樣式

HTML常規(guī)下劃線標(biāo)簽

在HTML u標(biāo)簽下劃線標(biāo)簽“U”即可對對象文字加html下劃線。

實(shí)例：

<u>我被U標(biāo)簽加下滑線</u>

CSS控制對象下劃線屬性樣式

html u下劃線與CSS下劃線對比應(yīng)用案例

CSS去掉html標(biāo)簽劃線樣式

如果我們想去掉對應(yīng)html中刪除線s標(biāo)簽刪除線樣式、去掉html u下劃線、去掉html上劃線樣式。

1、去掉html s刪除線貫穿線樣式

.p s{text-decoration:none}

去掉p類對象盒子里html s標(biāo)簽樣式屬性

2、去掉html u下劃線樣式

.p u{text-decoration:none}

去掉p類對象盒子里u標(biāo)簽下劃線線樣式屬性

五、超鏈接下劃線高級運(yùn)用 - TOP

我們接下來為大家講解常見CSS 超鏈接,當(dāng)隨便經(jīng)過時(shí)候文字對象被加下劃線。

代碼如下：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html;
 charset=utf-8" /> 
<title>下劃線演示</title> 
<style> 
.yangshi a{ text-decoration:none;}
/* css注釋： 鼠標(biāo)經(jīng)過熱點(diǎn)文字被加下劃線 */ 
.yangshi a:hover{ text-decoration:underline;}
/* 鼠標(biāo)經(jīng)過熱點(diǎn)文字被加下劃線 */ 
</style> 
</head> 
<body> 
<p> 
<span class="yangshi"> 
<a href="http:/www.php.cn">p</a> 
</span> 
</p> 
</body> 
</html>

請將以上代碼復(fù)制新建HTML即可查看該實(shí)例樣式。

我們進(jìn)行對3個(gè)盒子對象分別設(shè)置對象內(nèi)文字下劃線、文字刪除線樣式、字體上劃線樣式。

1、css代碼片段：

.p{text-decoration:underline}

.p_1{text-decoration:line-through}

.p_2{text-decoration:overline}

2、html代碼片段：

<p class="p">我被加下劃線</p>

<p class="p_1">我被加貫穿刪除線</p>

<p class="p_2">我被加上劃線</p>

介紹了這么多相信大家已經(jīng)掌握了text-decoration，有需要的朋友可以保存一下，也請大家持續(xù)關(guān)注本站的其他更新。

相關(guān)閱讀：

html的注釋有什么作用


CSS里怎么清除浮動


html中的label標(biāo)簽使用方法

以上就是如何使用text-decoration的詳細(xì)內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！


網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。