CSS文檔的外框居中是一個(gè)常見的問題。下面我們來討論幾種方法。

首先，我們可以使用margin:auto實(shí)現(xiàn)外框居中。

.container {
width: 400px;
margin: auto;
border: 1px solid black;
}

這個(gè)方法的原理是將左右margin設(shè)置為auto，這樣就會(huì)自動(dòng)計(jì)算margin值，讓元素水平居中。

其次，我們也可以使用flex布局。

.container {
display: flex;
justify-content: center;
align-items: center;
border: 1px solid black;
}

flex布局的justify-content和align-items屬性可以讓元素水平和垂直居中。

第三種方法是使用絕對定位。

.container {
position: relative;
border: 1px solid black;
}
.inner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

我們需要先為元素的父級設(shè)置position: relative，然后將子元素使用絕對定位，再使用top和left屬性以及transform將其居中。

以上三種方法都可以實(shí)現(xiàn)CSS文檔的外框居中。根據(jù)實(shí)際需求和使用場景，選擇合適的方法即可。