在 css 中,border 屬性用于為元素添加邊框,它由 border-width、border-style 和 border-color 三個(gè)子屬性組成。border-width 設(shè)置邊框?qū)挾龋琤order-style 設(shè)置邊框樣式,border-color 設(shè)置邊框顏色,還可以使用 border-top/right/bottom/left 簡化特定方向的邊框設(shè)置。
CSS 中 border 的用法
在 CSS 中,border 屬性用于給元素添加邊框。它是一個(gè)復(fù)合屬性,由以下幾個(gè)子屬性組成:
border-width: 設(shè)置邊框的寬度。
border-style: 設(shè)置邊框的樣式(如實(shí)線、虛線或無邊框)。
border-color: 設(shè)置邊框的顏色。
用法:
要為元素添加邊框,可以使用以下語法:
<code class="<a style='color:#f60; text-decoration:underline;' href=" https: target="_blank">css">selector { border: border-width border-style border-color; }</code>
登錄后復(fù)制
例如:
<code class="css">p { border: 1px solid black; }</code>
登錄后復(fù)制
這將為所有 <p></p>
元素添加一個(gè)黑色實(shí)線邊框,寬度為 1px。
子屬性說明:
border-width:
值:長度單位(如 px、em、%),或關(guān)鍵詞 auto(由瀏覽器自動計(jì)算)。
默認(rèn)值:medium(對于大多數(shù)瀏覽器為 3px)。
border-style:
值:
none:無邊框
solid:實(shí)線
dashed:虛線
dotted:點(diǎn)狀線
double:雙線
默認(rèn)值:none
border-color:
值:顏色值(如 #000、rgb(0, 0, 0)、關(guān)鍵詞 transparent(透明))。
默認(rèn)值:瀏覽器默認(rèn)顏色(通常為黑色)。
特殊用法:
border 屬性還可以用于簡化邊框設(shè)置:
border-top/right/bottom/left: 為特定方向設(shè)置邊框。
border-radius: 設(shè)置邊框的圓角。
border-image: 指定用圖像作為邊框。
例如:
<code class="css">div { border-top: 5px solid red; border-radius: 10px; }</code>
登錄后復(fù)制