本篇內容介紹了“如何給HTML標簽中的文本添加修飾線”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

十年的貢嘎網站建設經驗，針對設計、前端、開發(fā)、售后、文案、推廣等六對一服務，響應快，48小時及時工作處理。成都全網營銷的優(yōu)勢是能夠根據用戶設備顯示端的尺寸不同，自動調整貢嘎建站的顯示方式，使網站能夠適用不同顯示終端，在瀏覽器中調整網站的寬度，無論在任何一種瀏覽器上瀏覽網站，都能展現優(yōu)雅布局與設計，從而大程度地提升瀏覽體驗。創(chuàng)新互聯從事“貢嘎網站設計”,“貢嘎網站推廣”以來，每個客戶項目都認真落實執(zhí)行。

text-decoration屬性介紹

text-decoration屬性是用來設置文本修飾線呢，text-decoration屬性一共有4個值。

text-decoration屬性值說明表

值 作用

none 去掉文本修飾線

underline 設置下劃線

overline 設置上劃線

line-through 設置刪除線

HTML標簽自帶修飾線

在開始實踐text-decoration屬性之前，筆者先給大家普及下HTML中的標簽自帶修飾線如：u標簽、s標簽，若有不全大家可以在下面評論中告訴筆者,畢竟筆者也是前端的一個小白,希望和大家相互交流，互幫互助，共同進步。

u標簽

下面讓我們進入u標簽的實踐，u標簽自帶的是文本下劃線。

成功不是擊敗別人，而是改變自己

結果圖

注意：u標簽也可以配合HTML中的其他標簽使用，舉例：將u標簽嵌套到h2標簽中使用。

成功不是擊敗別人，而是改變自己

s標簽

下面讓我們進入s標簽的實踐，s標簽自帶的是文本刪除線。

成功不是擊敗別人，而是改變自己

結果圖

注意：s標簽也可以嵌套，和u標簽一致，筆者就不過多的介紹了。

none去除修飾線

讓我們進入text-decoration屬性的none值實踐，實踐內容如：筆者將HTML頁面中的s標簽自帶的刪除線給去除掉。

代碼塊

成功不是擊敗別人，而是改變自己

結果圖

注意：u標簽、s標簽、包括text-decoration屬性值的所有的修飾線都可以去掉哦。

underline設置下劃線

讓我們進入text-decoration屬性的underline值實踐，實踐內容如：筆者將HTML頁面中的h3標簽中的文本設置一個下劃線。

代碼塊

成功不是擊敗別人，而是改變自己

結果圖

overline設置上劃線

讓我們進入text-decoration屬性的overline值實踐，實踐內容如：筆者將HTML頁面中的h3標簽中的文本設置一個上劃線。

代碼塊

成功不是擊敗別人，而是改變自己

結果圖

line-through設置刪除線

讓我們進入text-decoration屬性的line-through值實踐，實踐內容如：筆者將HTML頁面中的h3標簽中的文本設置一個刪除線。

代碼塊

成功不是擊敗別人，而是改變自己

“如何給HTML標簽中的文本添加修飾線”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關的知識可以關注創(chuàng)新互聯網站，小編將為大家輸出更多高質量的實用文章！