CSS 邊框內描邊 css 常用的邊框屬性有 border-width、border-style、border-color，通過這些屬性可以設置元素的邊框大小、樣式和顏色。但是有時候我們需要在邊框內部描繪一些圖形或線條來美化頁面，這時候邊框屬性就無法實現了。所以，我們需要一些新的方法來實現邊框內描邊。 一、box-shadow box-shadow 屬性是實現邊框內描邊的最常用方法之一。通過設置實際大小（0），將陰影放在邊框內部，同時設置顏色。 代碼：

p{
box-shadow:inset 0 0 10px #f00;
}

解析： - inset 表示內部陰影 - 0 0 表示陰影在 x 軸和 y 軸方向上沒有偏移 - 10px 表示陰影的大小為 10 像素 - #f00 表示陰影的顏色為紅色 二、偽元素 使用偽元素可以將邊框內的內容分離出來，從而單獨設置其樣式。具體做法是設置元素的 position 為 relative，然后在其內部創建一個絕對定位的偽元素，通過設置偽元素的大小、位置和顏色來實現邊框內描邊。 代碼：

p{
position:relative;
}
p::before{
content:"";
position:absolute;
top:5px;
left:5px;
right:5px;
bottom:5px;
border:1px solid #f00;
}

解析： - ::before 表示創建元素的偽元素 - content:"" 表示偽元素內部沒有任何內容 - position:absolute 表示偽元素絕對定位 - top、left、right、bottom 表示偽元素的位置，相當于設置其大小 - border 表示偽元素的邊框，即邊框內描邊的樣式 - #f00 表示邊框的顏色 三、嘗試屬性 在 CSS3 中，還有一些新屬性可以實現邊框內描邊，例如 outline-offset、outline、 border-image 等。可以嘗試使用這些屬性來更好地實現邊框內描邊效果。 總結： 邊框內描邊可以讓頁面更加美觀，但是需要注意的是，如果邊框過于復雜可能會導致頁面性能下降，因此需要根據實際情況進行選擇。以上介紹了三種最常用的方法，希望讀者在實際開發過程中可以靈活運用，實現更好的效果。