< p >CSS邊框里寫字< pre >在網頁設計中，邊框是一個很重要的設計元素，可以用來增強內容的吸引力和可讀性。
除了加粗、改變顏色和樣式，CSS還允許在邊框區域內添加文本和圖像。特別是在設計按鈕和標簽時，添加文本到邊框區域非常實用。
在CSS中，可以使用border屬性來控制邊框樣式、顏色和寬度。而使用border上面的shorthand屬性，比如border-top、border-right、border-bottom和border-left，可以對邊框的某一面進行單獨設置。
對于邊框區域內的文本，可以使用padding屬性來控制邊框內邊距的大小。接下來可以使用定位來設置文本的位置，并控制其在整個邊框區域內的位置。
如下面的例子所示，我們可以設置一個div元素的邊框，然后在其中添加一些文本：< div class="border-example" >This is some text inside a div with a border.< /div >.border-example {
border: 2px solid #ccc;
padding: 10px;
position: relative;
}
.border-example::before {
content: "";
position: absolute;
top: -8px;
left: -8px;
right: -8px;
bottom: -8px;
border: 2px solid #000;
}
.border-example p {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 1.2em;
color: #000;
}
在上面的例子中，我們在現有的div元素中添加了一個偽元素:before，通過設置其position為absolute，使其相對于div進行定位。然后設置border樣式，使其把整個div封裝在一個黑色邊框中。
接下來，使用相對定位屬性將文本放置在此邊框區域的中心位置。最后，使用transform屬性將文本在垂直和水平方向上移動50%。< /pre >
上一篇如何使用css設置區塊
下一篇好程序員css教學視頻