添加水平線以分解頁面上的內容

如何將HR標籤用於Web文檔

HR標籤傳統上用於向Web文檔添加水平線(有時稱為水平線)。 要添加一行,請輸入:


以指示瀏覽器使用默認設置在頁面或父元素的整個寬度上繪製一條線。 該默認行很簡單並且通常用於其目的,但可以指定屬性來更改行的大小,顏色和位置以及其他特徵。 修改水平線的外觀的方法在HTML4和HTML5之間改變。

人力資源標籤語義?

在HTML4中,HR標籤不是語義的。 語義元素用瀏覽器和開發人員易於理解的術語來描述它們的含義。 HR標籤只是一種將簡單線條添加到文檔的任何地方的方法。 只將元素的頂部或底部邊框設計為您希望線條出現的位置,在元素的頂部或底部放置一條水平線,但一般而言,HR標籤更容易用於此目的。

從HTML5開始,人力資源標籤變得語義化,現在它定義了段落級主題中斷,這是內容流的中斷,不保證新頁面或其他更強的分隔符 - 這是主題的變化。 例如,您可能會在故事中發生場景更改後發現HR標籤,也可能會指示參考文檔中的主題發生更改。

HR屬性在HTML4和HTML5中

在HTML4中,可以給HR標籤分配簡單的屬性,包括“align”,“width”和“noshade”。 對齊可以設置為左側,中間,右側或對齊。 寬度調整了水平線的寬度,使其橫跨頁面的默認百分比為100%。 noshade屬性呈現了純色線條而不是陰影色。 這些屬性在HTML5中已過時,您應該使用CSS來設置HTML5中的HR標籤。 例如,在HTML 4中:


生成一個高度為10像素的水平線。

使用CSS和HTML5,設計一個10像素高的水平線:


使用CSS來設計你的水平線可以讓你在設計網頁時有很大的自由度。 您可以在此樣式HR標籤文章中看到很多HR標籤樣式的示例。 只有寬度和高度樣式在所有瀏覽器中保持一致,所以在使用其他樣式時可能需要一些試驗和錯誤。 默認寬度始終為網頁或父元素寬度的100%。 規則的默認高度是兩個像素。