塊級元素：margin：0 auto；
行內元素：父級text-align:center,子級display:inline-block
width：fit-content;是將容器收縮至剛好可以包裹住內容，
因此父級的顯示寬度會剛好是子級內容平鋪後的長度，這裡文字溢位是由於設定了子級的寬度
子元素浮動，margin：0 auto；width：fit-content;(注：目前僅適用於chrome和firefox)
父元素設定：display：flex;justify-content:center;同時此設定對div中的文字有效，可使文字居中
flex
比較常見的絕對定位方法,display:absolute;margin-left:容器寬度一半的負值，可百分比
絕對定位+margin-left:-xx;
利用css3新屬性：transform:translate(-50%,0);基本思路類似於絕對定位,但可忽略容器寬度的變化
絕對定位+transform:translate(50%,0);
絕對定位方式，position:absolute;left:0;right:0;margin: 0 auto;
絕對定位+left、right:0;margin: 0 auto;
元素為單行文字，設定元素的行高為父級高度
元素為塊級元素，基本思想是使用display: inline-block, vertical-align: middle和乙個偽元素讓內容塊處於容器**.流行做法，適應ie7
用vertical-align:middle;
其父元素需要為th或td才會生效,但根據效果會發現子元素設定的寬高失效，撐滿父元素
2012flex,對父級display:flex;align-items:center;
絕對定位+transform:translate（百分比是以自身寬高為基準）
絕對定位+margin-top:50%;（百分比是以自身寬度為基準）
絕對定位+margin:auto 0;
元素的水平垂直居中
a.將行內元素包裹在塊級元素中，然後設定 text align center 塊級元素的寬度一定，這就是我們平常所用的 margin 0 auto。但是當塊級元素的寬度不定的時候，我們可以這樣 讓他display為inline型別，然後給父級標籤設定text align center實現。當然了還有...
元素的水平，垂直居中
逛了很多文章的總結，相當於乙個大彙總，將我主要參考的人放在鏈結裡有大神顏海鏡和大神張鑫旭 子元素 其中的.size是來討論當子元素有無寬高的解決方法，效果如下 方法一 absolute 負margin 這也是我在自學過程中遇到的最多的一種方式 html 同上面的基礎 一樣，就不寫了，寫一下css 注...
水平垂直居中的方式
div絕對定位水平垂直居中 margin 負間距 這或許是當前最流行的使用方法。div div絕對定位水平垂直居中 transforms 變形 div css不定寬高水平垂直居中 box box div 將父盒子設定為table cell元素，可以使用text align center和vertic...