居中在網頁布局常能看到，經過一周的學習，深感居中方式之多，故總結為以下文字。
一、水平居中
1.1定寬塊元素在塊元素之中的水平居中
父元素為塊元素，子元素同為塊元素且寬度確定（包括使用px或%確定寬度），對子元素css樣式中新增即可
1.2內聯元素在塊元素之中的水平居中
對塊元素（父元素）新增css樣式即可，內聯元素會直接處於父元素的居中位置，由於內聯元素大小與內容相同，因此會達到居中效果。
1.3不定寬塊元素在塊元素之中的水平居中
方法一：改變塊元素的屬性為內聯元素，對塊元素新增css樣式，然後採用1.2的方式進行居中。
方法二：直接對該元素設定，此方法對子元素與父元素同寬時可以使用
1.4絕對定位的水平居中
通常不會採用這種方式進行居中設定，但可以掌握方法。給父元素新增css樣式,使其成為包含塊，然後對子元素新增css樣式
其實這種情況與1.1一致，顯然1.1更簡便，這個方法更多用於垂直居中。
二、垂直居中
2.1單行文字的垂直居中
使行高等於塊元素寬度，即line-height=height，然後利用布局調整元素位置，即可實現設計稿需求的樣式。
此處懶得上圖
2.2內聯元素在塊元素之中的水平居中
對內聯元素設定對塊狀元素設定，這是利用了vertical-align的特性，當父元素設定了行高時，對齊的基準為父元素，若父元素未設定行高，則以同輩元素為基準。（此方法對單行文字效果較好）
2.3定高塊元素的垂直居中
對父元素的padding-top=padding-bottom即可。此方法同樣適用於多行文字的垂直居中。
2.4不定高塊元素的垂直居中
方法一：為當前元素設定css屬性：在該元素後邊接乙個標尺，也就是給他新增乙個同輩的元素並且和你這個p標籤之間是不能有空格和回車的，再設定這個元素的css屬性為
方法二：對父元素設定css屬性為，這是將父元素的型別變為**中單元格，單元格的特點是不能設定margin但可以直接使用vertical-align屬性，因此也能達成目的。
ps：我嘗試了將元素轉化為inline-block然後使用2.2的方法，但由於元素會呈現內聯元素的特點，多行文字會變為一行，在不設定overflow的情況下，會溢位，因此不能使用此方法。
CSS居中方式總結
一 水平居中 1 行內元素或者display為inline的塊級元素，前提是子元素沒有float 對父元素設定 text align center 2 塊級元素 已知寬高 1 元素自身設定為 margin 0 auto 2 利用絕對定位和margin結合的方式 elem 3 塊級元素 未知寬高 1 ...
CSS居中方式總結
1.text align center 使用以上方式居中是將父級容器中display inline 的行內元素或者文字進行水平居中。2.inline height height 值 使用inline height時經常和height一起使用，使得內容垂直方向上居中，建議在列表內部的li中使用 3.m...
CSS居中方式總結
1.text align center 使用以上方式居中是將父級容器中display inline 的行內元素或者文字進行水平居中。2.inline height height 值 使用inline height時經常和height一起使用，使得內容垂直方向上居中，建議在列表內部的li中使用 3.m...