您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關css中使用text-decoration的方法的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
如何使用text-decoration?
使用CSS屬性單詞:
text-decoration : none || underline || blink || overline || line-through
text-decoration下劃線CSS單詞值參數:
none : 無裝飾
blink : 閃爍
underline : 下劃線
line-through : 貫穿線
overline : 上劃線
text-decoration:none 無裝飾,通常對html下劃線標簽去掉下劃線樣式
text-decoration:underline 下劃線樣式
text-decoration:line-through 刪除線樣式-貫穿線樣式
text-decoration:overline 上劃線樣式
HTML常規下劃線標簽
在HTML u標簽下劃線標簽“U”即可對對象文字加html下劃線。
實例:
<u>我被U標簽加下滑線</u>
CSS控制對象下劃線屬性樣式
html u下劃線與CSS下劃線對比應用案例
CSS去掉html標簽劃線樣式
如果我們想去掉對應html中刪除線s標簽刪除線樣式、去掉html u下劃線、去掉html上劃線樣式。
1、去掉html s刪除線貫穿線樣式
.p s{text-decoration:none}
去掉p類對象盒子里html s標簽樣式屬性
2、去掉html u下劃線樣式
.p u{text-decoration:none}
去掉p類對象盒子里u標簽下劃線線樣式屬性
五、超鏈接下劃線高級運用 - TOP
我們接下來為大家講解常見CSS 超鏈接,當隨便經過時候文字對象被加下劃線。
代碼如下:
<!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注釋: 鼠標經過熱點文字被加下劃線 */ .yangshi a:hover{ text-decoration:underline;} /* 鼠標經過熱點文字被加下劃線 */ </style> </head> <body> <p> <span class="yangshi"> <a href="http:/www.php.cn">p</a> </span> </p> </body> </html>
請將以上代碼復制新建HTML即可查看該實例樣式。
我們進行對3個盒子對象分別設置對象內文字下劃線、文字刪除線樣式、字體上劃線樣式。
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>
感謝各位的閱讀!關于“css中使用text-decoration的方法”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。