CSS中的border屬性可以用來給一個元素添加邊框，但是有時候我們發現邊框并不會居中，而是緊貼著元素的外側或者內側。那么該怎么做才能讓border居中呢？

首先，我們需要了解一下border-box模型和content-box模型的區別。

.box{
width: 300px;
height: 200px;
border: 1px solid black;
box-sizing: border-box;
}

上面的代碼中，box-sizing屬性被設置為border-box，表示元素的寬度和高度包括了border和padding。這種模型下，border會居中。

.box{
width: 300px;
height: 200px;
border: 1px solid black;
box-sizing: content-box;
}

而如果box-sizing被設置為content-box，表示元素的寬度和高度不包括border和padding。這種模型下，border會在元素的外邊框上方或下方。

另外，我們還可以利用margin的負值來讓border居中。

.box{
width: 300px;
height: 200px;
margin: 50px;
border: 1px solid black;
box-sizing: content-box;
}

在這個例子中，margin被設置為50px，表示讓元素與周圍的距離為50px。同時，border也被設置為1px，表示邊框的寬度為1px。如果不使用margin的負值來讓border居中，那么最終的距離就會是50px+1px。但是，如果我們使用margin的負值來抵消這個距離，就可以讓border居中了。

通過上面的幾種方法，我們可以讓border居中，讓我們的頁面看起來更加美觀和統一。