CSS圓角邊框凹進去,是一種美觀的樣式,通常用于按鈕或者特殊的容器。下面是一個例子:
.box { width: 200px; height: 100px; padding: 20px; border: 1px solid #ccc; border-radius: 10px; box-shadow: inset 0px 0px 10px #ddd; }
這個代碼塊定義了一個寬200像素、高100像素的容器,并且給它加上了20像素的內(nèi)邊距以及1像素的實線邊框。border-radius屬性定義了邊框的圓角半徑,這里是10像素。最后一個屬性box-shadow定義了內(nèi)陰影,執(zhí)行inset表示陰影在邊框內(nèi)部。這個陰影看起來像是容器被按下的樣式。
上述代碼可以隨意調(diào)整參數(shù)來實現(xiàn)不同的樣式。比如,增加內(nèi)邊距和陰影的大小可以讓凹進去的效果更加明顯。調(diào)整圓角半徑可以得到不同的圓角。
總之,CSS圓角邊框凹進去是一種值得掌握的技巧,可以讓網(wǎng)站看起來更加美觀。