line-height的不同属性的值区别

‘官方’对line-height的介绍

设置多行元素的空间量,如多行文本的间距。对于块级元素,它指定元素行盒(line boxes)的最小高度。对于非替代的 inline 元素,它用于计算行盒(line box)的高度。
line-height 属性被指定为以下任何一个:

  • < 数字 > 无单位数字乘以该元素的字体大小。计算值与指定值相同。推荐方法
  • < 长度 > px/em等长度单位 em取决于父级元素字体大小,em有不定因素
  • <百分比 > 与元素自身的字体大小有关。计算值是给定的百分比值乘以元素计算出的字体大小。
  • < normal >取决于用户端。桌面浏览器(包括Firefox)使用默认值,约为1.2,这取决于元素的 font-family

实际操作

1.数字
子元素line-height=(父元素的line-heigh: 1.3 * 自身字体大小)
要么自己的行高*自身字体大小
在这里插入图片描述
2.em
子元素line-height =(父元素的line-heigh: 1.3 * 父元素字体大小)
自身有line-heigth 的话,也就是自身字体大小就跟px一样了。
` 子元素行高自动基础父元素的(line-height * 字体大小)
3.百分比
父元素的字体大小 * 百分比 和em很相似

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值