inline-block元素带有文本属性宽高属性,但是,绝对不是块级元素,在使用inline-block,一旦发现排列问题,第一要想到的是他的文本属性导致的,因为文本有字号和行高,会改变这一行的基线位置

解决办法:

font-size = 0 字号为0,基线和其他的线重合,字体高度为0
vertical-align: top; 改变对齐方式
使用float 脱离文档流 ,成为blcok,失去文本特性
使用block 变成块级元素,失去文本特性

inline-block元素巨坑

inline-block元素巨坑

比如 a标签左右并没有空格 就没有空白文本节点,但是依然有类似不占位置的空白文本节点,有行高,字号默认字号

相关文章: