CSS中div居中設(shè)置，讓網(wǎng)頁排版更美觀

在CSS中，我們可以通過設(shè)置div的樣式來使其水平或垂直居中，這種技巧在網(wǎng)頁排版中非常有用，可以讓我們的網(wǎng)頁更加美觀、易讀。

我們來看看如何設(shè)置div的水平居中，這可以通過設(shè)置div的樣式來實現(xiàn)，我們可以給div添加以下樣式：

div {
  margin-left: auto;
  margin-right: auto;
}

這個樣式會將div的水平位置設(shè)置為自動，這樣瀏覽器就會自動計算并設(shè)置div的水平居中位置。

我們來看看如何設(shè)置div的垂直居中，垂直居中的設(shè)置稍微復(fù)雜一些，因為我們需要考慮不同瀏覽器對垂直居中的支持情況，一種通用的方法是使用CSS的transform屬性來實現(xiàn)：

div {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

這個樣式會將div的頂部位置設(shè)置為父元素高度的50%，然后通過transform屬性將div向上移動其自身高度的一半，從而實現(xiàn)垂直居中。

需要注意的是，這種方法在IE 8及以下版本中可能無法正常工作，如果我們需要支持這些瀏覽器，就需要使用其他方法來實現(xiàn)垂直居中。

CSS中div居中設(shè)置是一個很有用的技巧，可以讓我們更好地控制網(wǎng)頁元素的排版，通過水平居中和垂直居中的設(shè)置，我們可以打造出更加美觀、易讀的網(wǎng)頁界面。