CSS中有一種設置方法可以將一個元素在父級元素中水平居中，也就是左右居中，許多網站都會用到這種布局方式。

首先，我們需要將父級元素設置為相對定位，因為水平居中是需要參考父級元素的寬度的

.parent {
position: relative;
width: 600px;
height: 400px;
}

然后，我們需要將子元素設置為絕對定位，left和right屬性值都為0，也就是頂格，這樣子元素的寬度會占據父級元素的全部寬度

.child {
position: absolute;
left: 0;
right: 0;
width: 200px;
height: 100px;
}

然而此時，子元素仍然沒能水平居中，這是因為它的左邊框和右邊框分別貼緊了父級元素的左邊和右邊，我們需要再加上一個屬性——margin自動，它會將剩余的空間平分在左右兩側，實現水平居中的效果。

.child {
position: absolute;
left: 0;
right: 0;
margin: auto;
width: 200px;
height: 100px;
}

現在，子元素就已經成功地被水平居中了，這是CSS中一種經典的布局方式。