試一試
<p>§1: The first rule of Fight Club is: You do not talk about Fight Club.</p>
<hr />
<p>§2: The second rule of Fight Club is: Always bring cupcakes.</p>
hr {
border: none;
border-top: 3px double #333333;
color: #333333;
overflow: visible;
text-align: center;
height: 5px;
}
hr::after {
background: white;
content: "§";
padding: 0 4px;
position: relative;
top: -13px;
}
歷史上,這被呈現為一條水平線或分隔線。雖然在視覺瀏覽器中它仍然可以顯示為一條水平線,但該元素現在是根據語義而不是表現來定義的,所以如果你想繪製一條水平線,你應該使用合適的 CSS 來實現。
屬性
此元素的屬性包括全域性屬性。
align已棄用 非標準-
設定頁面上分隔線的對齊方式。如果未指定值,則預設值為
left。 color已棄用 非標準-
透過顏色名稱或十六進位制值設定分隔線的顏色。
noshade已棄用 非標準-
設定分隔線不顯示陰影。
size已棄用 非標準-
設定分隔線的高度(以畫素為單位)。
width已棄用 非標準-
透過畫素值或百分比值設定頁面上分隔線的長度。
示例
HTML
html
<p>
This is the first paragraph of text. This is the first paragraph of text. This
is the first paragraph of text. This is the first paragraph of text.
</p>
<hr />
<p>
This is the second paragraph of text. This is the second paragraph of text.
This is the second paragraph of text. This is the second paragraph of text.
</p>
結果
技術摘要
| 內容類別 | 流內容. |
|---|---|
| 允許內容 | 無;它是一個空元素。 |
| 標籤省略 | 必須有起始標籤,且不能有結束標籤。 |
| 允許父級 | |
| 隱式 ARIA 角色 | separator |
| 允許的 ARIA 角色 |
presentation 或 none |
| DOM 介面 | HTMLHRElement |
規範
| 規範 |
|---|
| HTML # the-hr-element |
瀏覽器相容性
載入中…