在CSS中,可以使用border
屬性為元素添加邊框。border
屬性可以設(shè)置一個(gè)元素的邊框?qū)挾取⑦吙蝾伾瓦吙驑邮健?/p>
以下代碼將為元素添加一個(gè)寬度為2像素、顏色為黑色、樣式為實(shí)線的邊框:
element { border: 2px solid black; }
在border
屬性中,***個(gè)值表示邊框?qū)挾?,第二個(gè)值表示邊框顏色,第三個(gè)值表示邊框樣式,除了實(shí)線樣式solid
,還有虛線樣式dashed
、點(diǎn)線樣式dotted
等。
也可以單獨(dú)設(shè)置元素的四個(gè)邊,
element { border-top: 2px solid black; border-right: 2px dashed red; border-bottom: 3px dotted green; border-left: 4px solid blue; }
這段代碼將分別為元素的四個(gè)邊設(shè)置不同的邊框?qū)挾?、顏色和樣式,注意,四個(gè)邊的設(shè)置順序通常按照上、右、下、左的順序排列。
除了使用border
屬性外,還可以使用border-radius
屬性為元素添加圓角邊框。
element { border-radius: 10px; }
這段代碼將為元素添加半徑為10像素的圓角邊框,如果需要設(shè)置不同角的圓角半徑,可以使用以下語(yǔ)法:
element { border-radius: 10px 20px 30px 40px; }
這段代碼將分別設(shè)置元素的四個(gè)角的圓角半徑,注意,四個(gè)角的設(shè)置順序通常按照上、右、下、左的順序排列。