内联元素内文字的上下间距怎么去掉?

2019-04-11 14:08发布

问题:

之前在p这类块元素中的文字,给line-hight=1;就可以去掉文字自带的上下间距,
最近突然发现这个方法在行内块和块元素上好使,可当用在span或者a这类内联元素上都不好使,除了转为块元素的方法来去掉上下间距,还有其他方法吗?还有,为什么行高设置为1去不掉内联元素文字的上下间距呢?!

回答1:

padding和line-height均会造成空白,但是line-height要在span是块元素时才有效。
和 font-family、 vertical-align、 line-height 以及padding(如果display是inline-block 或者block 否则不会影响其高度)都是有关系的,你根据这些在调一下



回答2:

一般这种情况我会加一个 display:inline-block



回答3:

查阅很多资料之后,得出结论:
行内的高度是不受行高影响的,因此设置line-height=1只能影响行内元素在容器中所占据的高度(字号大小的高度),而自己本身的高度未曾改变,哪怕是超出了父容器(在给行内元素设置了背景色之后就可以直观的看到)。