在 CSS 中,我們可以通過設置
padding屬性來實現內凹效果,同時還可以利用
border-radius屬性來實現半圓邊框效果。
下面是一個實現內凹效果的例子:
.box { padding: 20px; background-color: #eee; }
在上面的例子中,我們設置了
padding為 20px,相當于在盒子內部留出了一個 20px 的空白區域,這樣就實現了內凹的效果。
而如果要實現半圓邊框效果,可以這樣寫:
.box { border-radius: 50%; border: 5px solid #ccc; }
在上面的例子中,我們設置了
border-radius為 50%,這樣就實現了半圓的形狀。同時,我們還設置了
border為 5px 的實線,顏色為 #ccc,這樣就實現了半圓邊框的效果。
需要注意的是,實現半圓邊框效果時,盒子的寬度和高度應該相等,否則半圓邊框會變成橢圓形。