CSS中的外部樣式非常重要，其中的margin（外邊距）屬性也是常用的一個屬性。margin可以控制元素與周圍元素之間的距離，有時我們會遇到需要居中元素的情況，下面就給大家介紹如何使用margin實現水平居中和垂直居中。

水平居中可以通過設置元素的左右margin為auto來實現：

.element {
width: 200px;
margin: 0 auto;
}

上面的代碼中，將元素的寬度設置為200px，然后將左右margin設置為auto，這樣就可以實現水平居中。

垂直居中比較麻煩，可以通過以下兩種方法來實現：

方法一：使用絕對定位和transform

.parent {
position: relative;
}
.child {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

上面的代碼中，將父元素設置為相對定位，然后將子元素設置為絕對定位，并將top和left設置為50%，然后通過transform屬性來將子元素向上、向左移動50%，實現垂直水平居中。

方法二：使用flex布局

.container {
display: flex;
justify-content: center;
align-items: center;
}

上面的代碼中，將父元素設置為flex布局，并將justify-content和align-items屬性都設置為center，這樣就可以實現垂直水平居中了。

總結：通過上面的方法，我們可以很方便地實現元素的居中。水平居中可以通過設置左右margin為auto，垂直居中可以使用絕對定位和transform或者flex布局來實現。