- 内联元素：display:inline-* span label input button a br i strong q img
- 替换元素： img <input type='image'/> iframe video audio embed option canvas object applet
- 幽灵空白节点：html5里内联元素 行框盒子前都有一个宽度为0，可有高度，有基线的空白节点
vertical-align只对内联元素生效，内联元素又包括内联可替换元素（下文简称替换元素），内联非替换元素
vertical-align:baseline默认
- baseline:
-- 对于文本类内联元素 是字符x的下边缘；
--对于替换元素 是自身下边缘；
--对于inline-block，若里面没有内联元素或overflow:!visible，是margin底边缘； 若有的话 则是最后一行内容的基线
https://stackoverflow.com/questions/43996242/whats-the-deal-with-vertical-align-baseline4个：字符x下边缘、自身下边缘、margin下边缘、最后一行内容的基线
vertical-align:middle
- middle ：
-- 对于内联元素 内里x交叉点的位置
-- 对于table-cell 相对外面的表格行对齐
line-height
- line-height决定了内联元素的高度， 不影响替换元素
-line-height: 可以继承
父{ font-size:20px,line-height:1.5 or 200% or 2em }
子：{font-size:30px;}
子继承的行高分别对应是 30*1.5 or 20*200% or 20*2
