1) vertical-align 屬性
- 只適用于
display為inline或者inline-block的元素 - 與
text-align屬性不同寞焙，vertical-align屬性寫在子元素里面
原文：
Vertical align only works for inline,inline-blocks,images,and table elements.
It has to be applied on the child element, as oppose to the parent element, unlike text-align.
2) text-align 屬性
3) margin: 0 auto; 屬性
盒子模型是說HTML中的每個元素都是被包圍在一個盒子里面的，這個盒子有四個方面的內(nèi)容，一個是content，一個是border父虑，在border和content之間就是padding的距離瘫证，而border與父容器之間的距離稱為margin。這樣來記的話就不會混淆margin和padding了执俩。
我們通常設(shè)定的width和height其實都是盒子的寬度，更具體的說是border的寬和高癌刽。因為margin是對外的役首，而padding是對內(nèi)的。所以显拜，我們經(jīng)常會看到居中對齊的時候會出現(xiàn)margin:0 auto衡奥，意思是距父容器頂部距離為0px，而左右下三部分自動調(diào)整远荠。
這也就是我們只見過margin：0 auto矮固，卻沒見過padding：0 auto的原因。因為padding是對內(nèi)的矮台，padding的調(diào)整對盒子在整個頁面中的位置根本不能起任何作用乏屯。
如果使用margin:0 auto不好使，那么有一個很常見的原因是沒有寫width瘦赫。為啥沒標(biāo)明width辰晕，margin就不起作用呢？實際上确虱，margin不是沒起作用含友，而是你沒看到它起作用。因為如果沒著名width的話校辩，那么子容器的寬度會自動充滿父容器的寬度窘问。而高度會根據(jù)子容器中元素內(nèi)容的多少而撐開。
這樣一來的話宜咒，如果width等于父容器的寬度惠赫，那么就本來是已經(jīng)居中的了。
不僅如此故黑，我們可以自己試驗一下儿咱，如果width設(shè)置的比較大（遠(yuǎn)大于內(nèi)容的寬度）庭砍，那么當(dāng)使用margin屬性時會看到內(nèi)容并沒有居中，為啥混埠？因為width太大了怠缸，而子容器現(xiàn)在已經(jīng)是居中的了，但是容器內(nèi)部的元素并沒有居中钳宪。
那如何讓內(nèi)容居中呢揭北？我能想到的辦法就是讓子容器的寬度減少，或者在父元素中寫text-align：center將子容器內(nèi)容居中吏颖。
更詳細(xì)的原文轉(zhuǎn)載戳這里
