伸縮布局
定位 利用css的 position屬性，
把大盒子相對於小盒子的top、left都設定為50%，
然後再用margin-top設定為小盒子的高度的負一半拉回來，
用marg-left設定為寬度的負一半拉回來
利用margin
position屬性
利用css3的新增屬性table-cell, vertical-align:middle;
利用transform的屬性,注意子絕父相定位
兩者都要固定定位,不常用（缺點：需要設定position屬性，網頁複雜時容易擾亂頁面布局,而且只是元素的起始位置居中 ）
css樣式盒子常見的幾種居中方式
假設乙個div裡面有乙個p元素。第一種居中方式 利用了偽元素讓子元素p在div盒子裡左右水平居中只需要在它的父元素div裡加text align center 垂直方向居中需要在父元素後面加了乙個偽元素，並使得樣式為inline block height 100 就是和父元素一樣高，vertical...
實現div盒子水平垂直居中的幾種方式
1.第一種方式元素已知寬度高度，絕對定位absolute margin一半 middle background red width 200px height 200px position absolute top 50 left 50 margin left 100px margin top 100...
盒子水平居中的幾種方案
這種需求在我之前的專案當中是非常常見的剛開始的時候我是用position定位的方式來實現的，後來隨著css3的興起，display flex的方式尤其是在移動端開發的時候來實現它是非常強大的，然後有一段時間我在看部落格的時候發現display table cell的方式雖然不常用但是也可以實現，當然...