[toc] ## inherit ## 线类 baseline、top、middle、bottom >baseline >  如果是替换元素的基线，就等同于其底线 另外基线对齐，会导致行框（对，是行框）下沉 >bottom(top): 1. inline/inline-block元素：元素底部和整行的底部对齐 2. table-cell元素：单元格底padding边缘和表格行的底部对齐 > middle 1. inline/inline-block：元素的垂直中心点和父元素基线上1/2x-height对齐 2. table-cell：单元格填充盒子相对于外面的表格行居中对齐  font-size越大，文字下沉越明显（微软雅黑更明显） 解决办法： 1. font-size设为0，此时各种线都合为一条 2. 或则一再弄一个空的inline-block span  ## 文本类 text-top、text-bottom text-top：盒子的顶部和父级content-area的顶部对齐 bottom：盒子的底部和父级content-area的底部对齐    ## 上标下标类 sub、super ### html中的上标下标 `<sup>`：等于vertical-align:super `<sub>`：等于vertical-align:sub 用了上标下标的字体为原来的75%左右   ## 数值百分比类 20px、2em、20% 数值(相对于基线)和百分比(相对于行高计算) 1. 都带数字 2. 都支持负值 (margin、letter-spacing、word-spacing、vertical-align) 3. 行为表现一致 ## vertical-align与前后的元素没有关系只和父级有关系