在CSS中,可以使用border-radius
屬性來讓邊框變圓,這個(gè)屬性可以設(shè)置一個(gè)元素的邊框的圓角程度。
如果你想要一個(gè)元素的四個(gè)角都變圓,你可以這樣寫:
element { border-radius: 50%; }
這會(huì)將元素的四個(gè)角都設(shè)置為50%的圓角程度,也就是將角變?yōu)榘雸A形,如果你想要不同大小的圓角,你可以調(diào)整border-radius
的值。
如果你想要單獨(dú)設(shè)置每個(gè)角的圓角程度,你可以這樣寫:
element { border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; }
這會(huì)將元素的每個(gè)角都設(shè)置為50%的圓角程度。
需要注意的是,border-radius
屬性只在CSS3及更高版本中受支持,如果你使用的是更舊的瀏覽器版本,那么這個(gè)屬性可能無法正常工作,在使用這個(gè)屬性時(shí),***好先確認(rèn)你的瀏覽器版本是否支持它。