html下劃線怎麼設定？ html下劃線樣式實例分析-html教學-PHP中文網

html下劃線怎麼設定？ html下劃線樣式實例分析

寻∝梦

發布： 2018-09-03 17:22:34

原創

10230 人瀏覽過

這篇文章主要的講述了關於HTML底線的設定方法，還有HTML底線的設定實例，本篇都是用css樣式來操作的，希望大家多掌握點css樣式基礎知識。

首先我們要說說怎麼設定底線：

我們知道HTML標籤中有底線u標籤( 被加底線 ) ，在需要下劃線的文字字體加上html下劃線標籤u即可簡單實現下劃線樣式。但在DIV CSS佈局時，有時需要CSS實現底線樣式效果，也就是css 底線樣式。

1.CSS下劃線樣式單字：

text-decoration

2.CSS下劃線程式碼：

#text-decoration:underline

3.css 下劃線程式碼示範：

div{text-decoration:underline}

登入後複製

對div內文字加上底線樣式。

現在說css字體加上底線樣式實例：

以下是css 底線設定實例，實例內容對一段文字中其中幾個字設定下劃線樣式。

設定下劃線CSS樣式實例程式碼如下：

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>PHP中文网：设置下划线实例</title> 
<style> 
.exp{ text-decoration:underline} 
</style> 
</head> 
<body> 
欢迎访问PHP中文网，<span class="exp">我被加下划线样式</span>！ 
</body> 
</html>

登入後複製

#以上對一段文字中其中一些文字加上下劃線樣式。如下方的截圖效果：

html下劃線怎麼設定？ html下劃線樣式實例分析

最後說說div css下劃線設定總結：

可能大家會認為我們會用了HTML U標籤加底線，為什麼要使用CSS text-decoration樣式來加底線？這個是因為在CSS佈局中是千變萬化的實現各式各樣佈局，為了滿足不同需求所以一般HTML標籤能實現的CSS樣式都能實現，而有時使用CSS實現可利於後期修改維護，。但相反不是學習CSS就不用HTML標籤實現需要的樣式，而是有時HTML標籤和CSS樣式根據需求選擇佈局出最適合項目的才是DIV CSS佈局重要的精髓。達到程式碼最簡、程式碼易於維護、搜尋引擎排名考慮、程式設計師易用等。

好了，以上就是這篇文章的全部內容了，有問題的可以在下方提問。

【小編推薦】

html tbody標籤是區塊級元素嗎？ html tbody標籤的基礎用法

html中col標籤中的漢字如何居中？ html col標籤的基本使用(內有實例)

以上是html下劃線怎麼設定？ html下劃線樣式實例分析的詳細內容。更多資訊請關注PHP中文網其他相關文章！