line-height属性的细节
与大多数CSS属性不同,line-height支持属性值设置为无单位的数字。有无单位在子元素继承属性时有微妙的不同。

语法
line-height: normal | <number> | <length> | <percentage>
normal 根据浏览器决定,一般为1.2。
number 仅指定数字时(无单位),实际行距为字号乘以该数字得出的结果。可以理解为一个系数,子元素仅继承该系数,子元素的真正行距是分别与自身元素字号相乘的计算结果。大多数情况下推荐使用,可以避免一些意外的继承问题。
length 具体的长度,如px/em等。
percentage 百分比,100%与1em相同。

有单位(包括百分比)与无单位之间的区别
有单位时,子元素继承了父元素计算得出的行距;无单位时继承了系数,子元素会分别计算各自行距(推荐使用)。

其实区别就在于继承的问题上。

150%是根据父元素的字体大小计算出行高,并且子元素依然沿用这个计算后的行高(例如30px行高值,而不是按照比例去重新计算)。
而1.5则是根据子元素自己字体的大小去乘以1.5来计算行高。
另,1.5em等也是按照150%的情况来算的。

最新文章

  1. 【热文】 为什么很多硅谷工程师偏爱 OS X,而不是 Linux 或 Windows?
  2. Web页面多对象多文档事件冲突的解决方案
  3. Asp.net下载文件
  4. codeforces Gym 100187H H. Mysterious Photos 水题
  5. BitmapSource ConvertTo Bitmap
  6. Python爬虫和情感分析简介
  7. 关于开发环境 git 重新部署
  8. OC基础10:基本的C语言特性1
  9. git 常用命令及问题解决(转)
  10. 中兴电信光纤猫F450获取管理员密码方法
  11. Android hook神器frida(一)
  12. Vue.js优雅的实现列表清单
  13. Tomcat更新方法
  14. Java_基础篇(数组排序)
  15. makefile(一)
  16. 原生tab切换(适用于购物商城中订单管理模块,例如:待付款/待发货/待收货等订单状态)
  17. 基于react/vue的移动端终极适配方案vw单位(更新css-modules配置)
  18. {django模型层(二)多表操作}一 创建模型 二 添加表记录 三 基于对象的跨表查询 四 基于双下划线的跨表查询 五 聚合查询、分组查询、F查询和Q查询
  19. Linux宝塔软件安装
  20. elasticSearch6源码分析(10)SettingsModule

热门文章

  1. 良许 | 网络检测神器 ss 命令,你可能根本就不会用!
  2. (一)spring aop的两种配置方式。
  3. CodeForces 834D The Bakery
  4. Codeforces 468 B Two Sets
  5. UVA - 315 Network(tarjan求割点的个数)
  6. hdu 4081 Qin Shi Huang&#39;s National Road System(次小生成树prim)
  7. 04 python之函数详解
  8. NameNode数据存储
  9. Maven学习归纳(五)——继承与聚合实例讲解
  10. vue 页面跳转传参