CSS如何實現邊框居中

有時候我們需要讓一個元素的邊框居中。下面是兩種方法實現邊框居中。

方法一：使用內邊距

.box {
width: 200px;
height: 100px;
border: 2px solid #000;
padding: 10px;
text-align: center;
}

這里我們給容器設置了一個內邊距，將文字居中對齊。并且給邊框設置了一個固定的寬度和顏色。

方法二：使用彈性盒子

.container {
display: flex;
justify-content: center;
align-items: center;
width: 200px;
height: 100px;
border: 2px solid #000;
}

這里我們使用了彈性盒子布局，分別設置了容器的主軸和交叉軸都居中對齊。并且設置了容器的寬度和高度以及邊框的樣式。

以上是兩種常見的方式實現邊框居中，具體選擇哪種方式可以根據實際情況進行選擇。