css- vertical-align数值百分比类，如20px、2em、20%，百分比值相对于line-height计算

vertical-align属性值有4类：

线类，如baseline（默认值）、top、bottom、middle；
文本类，如text-top、text-bottom；
上标下标类，如sub、super；
数值百分比类，如20px、2em、20%，百分比值相对于line-height计算。

vertical-align只能运用于内联元素，以及display为table-cell的元素；

‘幽灵空白节点’导致高度超过32px：

<div class="box"><span>文字</span></div>
.box{
    line-height:32px;
}
.box > span{
    font-size:24px;
}

解决：

<div class="box"><span>文字</span></div>
.box{
    line-height:32px;
    font-size:32px;

}
.box > span{
    
}
或者
.box{
    line-height:32px;
   

}
.box > span{
     font-size:24px;
     vertical-align:top;
}