css設(shè)置下劃線的方法有哪些

本篇內(nèi)容主要講解“css設(shè)置下劃線的方法有哪些”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“css設(shè)置下劃線的方法有哪些”吧!

1、文字帶下劃線的方式顯示   
使用html中<u>標(biāo)簽即可對加u標(biāo)簽的文字加下劃線

但是注意的時(shí)候u標(biāo)簽是以<u>開始</u>結(jié)束的一對標(biāo)簽，<u>我是被加下劃線的</u>

2、超鏈接文字下劃線-css 超鏈接詳細(xì)介紹  

我們常常需要讓帶超鏈接的文字，以有下劃線方式顯示，而鼠標(biāo)放上去下劃線不顯示方式顯示帶鏈接的文字，接下來我們通過css對超鏈接下劃線設(shè)置
使用代碼text-decoration
語法：
text-decoration : none || underline || blink || overline || line-through
text-decoration參數(shù)：
none : 　無裝飾
blink : 　閃爍
underline : 　下劃線
line-through : 　貫穿線
overline : 　上劃線

“div css”被加入css鏈接，同時(shí)在css樣式也設(shè)置了css屬性a被加下劃線（a{ text-decoration:underline;}），但鼠標(biāo)放上去（a:hover{ text-decoration:none;}）下劃線則被去掉的

3、對超鏈接文字鼠標(biāo)放上去出現(xiàn)下劃線  

根據(jù)第二點(diǎn)（2、超鏈接文字下劃線）中通過css來讓超鏈接文字帶下劃線，鼠標(biāo)放上去則去掉下劃線來說，第三點(diǎn)則是剛好與第二點(diǎn)向反，超鏈接自然不顯示下劃線a{ text-decoration:none;}，而鼠標(biāo)放上去出現(xiàn)下劃線a:hover{ text-decoration:underline;}。

4、對某區(qū)域鼠標(biāo)放上去出現(xiàn)下劃線-對象下劃線 
 

這個(gè)在我們普遍使用，我們可以對其div設(shè)置一個(gè)class樣式(id與class區(qū)別)如：.ys:hover{ text-decoration:underline; cursor:pointer;}， 解釋cursor這個(gè)是鼠標(biāo)標(biāo)簽（cursor介紹），pointer這個(gè)是手指形式顯示。

通過這樣對“ys”設(shè)置了css樣式，則在瀏覽器中當(dāng)鼠標(biāo)放到文字上時(shí)就會(huì)出現(xiàn)下劃線，而這里不是因?yàn)橛谐溄硬庞邢聞澗€，同超鏈接原理相同。

到此，相信大家對“css設(shè)置下劃線的方法有哪些”有了更深的了解，不妨來實(shí)際操作一番吧！這里是億速云網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！