在網頁設計中,hr
是一個常用的分割線。然而,默認情況下,hr
的樣式與文本相同,若要讓其更加醒目,我們可以通過 CSS 給它添加粗線的樣式。
方法很簡單,只需要在 CSS 中設置hr
的border
樣式即可。
hr { border: 2px solid black; }
上面的代碼將hr
的邊框設置為 2 像素粗,顏色為黑色。
同樣的,我們也可以使用其他樣式屬性來改變hr
的樣式,例如border-style
和border-color
。
hr { border-style: dashed; /* 破折線樣式 */ border-color: blue; /* 藍色邊框 */ border-width: 3px; /* 3 像素粗 */ }
此外,我們還可以對hr
的寬度和高度進行調整。
hr { width: 80%; height: 3px; margin: 15px auto; }
以上代碼將hr
的寬度設置為屏幕的 80%,高度設置為 3 像素,且距離上下文的上下邊距均為 15 像素。
總的來說,CSS 可以讓我們方便地美化網頁中的各個元素,包括hr
這樣的簡單的分割線。