关于line-height的三两理解

说句实话,IFC这一块儿的东西真的有点难搞,刚开始是门儿都看不到,到后来用line-height做多了,又牵扯到了vertical-align,再到后来合起来用都实现不了效果,再到逐渐去理解IFC,现在也没理解得很明白。

认识line-height和vertical-align是从垂直居中对齐开始的,垂直居中本质是什么?那就是文字的基线问题,当你正确使用了line-height和vertical-align时,内联元素就能达成近似的居中效果,因为实际上还是有所区别的,存在line-height(非数值)时,设置vertical-align: middle,那么内部文字可以近似居中(实际上是文字总会多下沉一点)。

页面设计的时候,也或多或少发现了很有趣的问题,那就是height、line-height的问题,当二者都存在时,height所主导的元素高度是不会收到line-height的影响的,line-height所影响的仅仅是内部文字的垂直方向上的排版,而出现height: auto或者不设置height时,line-height就撑起了元素高度,内部文字也就会一直垂直居中。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值