CSS內凹的圓非常簡單,只需使用圓形的偽類選擇器和 box-shadow 屬性就可以實現。
.round { width: 50px; height: 50px; border-radius: 50%; border: 2px solid #000; box-shadow: inset 0 0 5px #000; }
以上代碼創建了一個寬高均為 50px 的內凹圓,你可以通過增加或減少 box-shadow 屬性的值來調整內凹的深度。此外,你也可以更改圓的樣式,例如,你可以增加或減少圓的邊框寬度,或者使用不同的邊框顏色。
使用 CSS 內凹的圓可以讓你的網站看起來更加現代化,同時也更能吸引用戶的注意力。不過要注意,過多地使用這種效果可能會使用戶感到困惑或者分心。所以一定要謹慎使用。