css將圖片設定為圓形圖片的方法：可以利用border-radius屬性來設定圓形圖片，程式碼如【border-radius:50%】。 border-radius屬性允許我們為元素新增圓角邊框。
本文操作環境：windows10系統、css 3、thinkpad t480電腦。
屬性介紹：
border-radius 屬性允許我們為元素新增圓角邊框。
語法：
border-radius: 1-4 length|% / 1-4 length|%;
注意: 每個半徑的四個值的順序是：左上角，右上角，右下角，左下角。如果省略左下角，右上角是相同的。如果省略右下角，左上角是相同的。如果省略右上角，左上角是相同的。
屬性值：
length 定義彎道的形狀。
% 使用%定義角落的形狀。
具體實作程式碼如下：
（學習影片分享：css影片教學）
style{
.circle{
width:120px;
height:120px;
border-radius:50%;
overflow:hidden;
}
.circle > img{
width: 100%;
height: 100%;
}
}
<div class="circle">
<img src="你的图片" alt="正方形的原始图片" />
</div>相關推薦：CSS教學
以上是css如何將圖片設定為圓形圖片的詳細內容。更多資訊請關注PHP中文網其他相關文章！
