CSS樣式中，我們經(jīng)常會(huì)使用圓形圖片或者圓形背景來(lái)進(jìn)行美化頁(yè)面。而在顯示圓形圖片時(shí)，如果將圖片寬高設(shè)置為相同的值，圖片就會(huì)呈現(xiàn)出圓形。但是，如果想要在圓形的底部留出一部分空白，該怎么做呢？

我們可以使用CSS中的padding屬性來(lái)實(shí)現(xiàn)這個(gè)效果。具體而言，我們可以將圖片的圓角半徑設(shè)為50%（以此來(lái)實(shí)現(xiàn)圓形），并設(shè)置padding-bottom屬性調(diào)整圓形圖片底部的留白。下面是具體代碼實(shí)現(xiàn)：

.img-circle {
width: 100px;
height: 100px;
border-radius: 50%;
padding-bottom: 20px;
}

通過(guò)這個(gè)樣式代碼，我們?cè)O(shè)置了圖片的寬和高均為100px，同時(shí)將圓角半徑設(shè)為50%，以此來(lái)實(shí)現(xiàn)圖片圓形的效果。接著，我們?cè)O(shè)置了padding-bottom屬性為20px，這樣就可以讓圓形底部留出一部分空白。

使用這種方法可以很方便地實(shí)現(xiàn)圓形圖片的底部留白效果，而不會(huì)影響到圖片的圓形顯示效果。如果需要將圖片垂直居中，可以通過(guò)設(shè)置display: flex;和justify-content: center;來(lái)實(shí)現(xiàn)。