頁面布局，居中是絕對少不了的，居中的方法有很多，今天分享幾個。
margin 0 auto、text-align:center、line-height這幾個就不用多說了，適合文字、和塊元素水平居中。如果知道容器高度或者是內容高度，很容易就能實現簡單的居中。
flex布局：
彈性布局，會使用的絕對非常建議使用這個布局，現在相容性也好，要是非得相容很低版本的瀏覽器，這個布局還是得考量一下。兩個居中屬性
justify-content: center;align-items: center;
transform: translatex(-50%) translatey(-50%)：
我們不知道容器寬高或者是內容寬高的時候，設定margin: 50%;然後使用transform的translated，這個屬性的單位不是具體的畫素單位的時候，百分比就是以自身的寬高計算的。一般都是配合定位使用。
display:table-cell，使用**屬性：
通過**屬性去居中，父元素：
display: table-cell;vertical-align: middle;text-align: center;
子元素需要設定：
display: inline-block;
絕對定位：
知道內容元素的寬高，設定top和left都是50%，這時候設定margin-top和margin-left內容元素寬高的一半，就能居中。
不知道寬高的情況下，設定top、left、right、bottom都設定0，然後margin: auto；也能居中。
coding 個人筆記
Css 居中的方法
css實現居中的方法 1.水平居中 text alian center 2.垂直居中 1 這個方法讓一些 顯示成table，然後我們就可以利用table的vertical align屬性了 vertical align作用在其他一些元素上會表現得非常不一樣 id cell class content...
css label 居中布局 CSS居中的方法總結
css水平和垂直居中在開發中經常用到，在此加以總結。水平居中方法 1.行內元素水平居中，設定父元素的text align center。center box 常用的行內元素有a abbr b br em input label select span strong sub sup textarea等...
CSS居中的常用方法
在web標準中的頁面布局是使用div配合css來實現的。這其中最常用到的就是使整個頁面水平居中的效果，這是在頁面布局中基本，也是最應該首先掌握的知識。不過，還是經常會有人問到這個問題，在這裡我簡單總結一下使用div和css實現頁面水平居中的方法 在現代瀏覽器 如internet explorer 7...