CSS(Cascading Style Sheets)是一種用于Web頁面設計的語言,可以通過它來定義各種文本、圖像、背景和布局的樣式。今天我們要介紹的是如何使用CSS來讓圖片變成圓形。
img { border-radius: 50%; }
上述代碼是通過設置一個常用樣式屬性 - border-radius 來實現的。border-radius屬性用于設置邊框的圓角。默認情況下,這個屬性會把圖片的4個角變成圓角,但我們這里將它設置為50%。
這個50%的值意味著,它會根據圖片的寬高比例自動調整圓角的大小,使得四個角都能剛好聯成一個圓形。這樣,我們就可以非常方便地讓圖片變成圓了。
總結一下,使用CSS讓圖片變圓很簡單,只需設置border-radius屬性值為50%即可。
下一篇css樣式重繪觸發