vertical-align筆記

1.vertical-align作用
①　控制單元格內容的垂直對齊方式。
②　控制多個行內（塊）元素在一行上的垂直對齊方式
③　控制行內（塊）元素相對其父元素垂直對齊方式
注意： vertical-align 只對行內與行內塊元素、表格單元格元素生效：不能用它垂直對齊塊級元素

注意： vertical-align 只對行內與行內塊元素、表格單元格元素生效：不能用它垂直對齊塊級元素

2.瀏覽器支持
所有瀏覽器都支持 vertical-align 屬性。
3.可能的值

表格單元格的值

top 單元格內容居上【使單元格內邊距的上邊緣與該行頂部對齊。】
middle 單元格內容居中【使單元格內邊距盒模型在該行內居中對齊。】
bottom 單元格內容居下【使單元格內邊距的下邊緣與該行底部對齊。】

相對行的值
控制多個行內（塊）元素在一行上的垂直對齊方式
【當一行中有多個行內塊元素時生效，如果只有一個元素那麼他的頂端就是行的頂端，他的底端就是行的底端，不管你設置top還是bottom，他都不會變化】

top	使元素及其後代元素的頂部與整行的頂部對齊。
bottom	使元素及其後代元素的底部與整行的底部對齊。

注意：
(1)一行的高度由該行最高元素的高度決定的，而不管其父元素有多高，除非我們顯式的設置了行高==父元素的高度。
(2)然後行高會存在繼承關係，如果我們設置了父元素的行高，那麼子元素會自動的繼承在父元素上設置的行高，這在很多時候都不是我們想要的，所以我們需要在子元素裏面重新定義行高。

相對父元素的值
具體值
控制行內（塊）元素相對其父元素垂直對齊方式

baseline	默認。使元素的基線與父元素（當前行）的基線對齊
middle	使元素的中部與父元素的基線加上父元素x-height（譯註：x高度）的一半對齊。
text-top	把元素的頂端與父元素字體的頂端對齊
text-bottom	把元素的底端與父元素字體的底端對齊。
sub	使元素的基線與父元素的下標基線對齊
super	使元素的基線與父元素的上標基線對齊。
length	使元素的基線對齊到父元素的基線之上的給定長度。可以是負數。
%	使元素的基線對齊到父元素的基線之上的給定百分比,該百分比是line-height屬性的百分比。可以是負數。

注意：沒有基線的元素，使用外邊距的下邊緣替代。

基線概念
在各種內聯相關模型中，凡是涉及到垂直方向的排版或者對齊的，都離不開最最基本的基線(baseline)。其他中線頂線一類的定義也離不開基線。
①　作爲父元素的塊級元素基線
塊級元素如果只有一行的內容,那麼就以字母x的底部作爲基線。
當有多行內容時，每行都有一個基線，兩個相鄰基線間的距離就是行高