line-height:1.5和line-height:150%的区别

1. 给你个数，孩子自己算吧 line-height:1.5

父元素设置line-height:1.5会直接继承给子元素，子元素根据自己的font-size再去计算子元素自己的line-height。

2.老子说多大就是多大 line-height:150%

父元素设置line-height:150%是计算好了line-height值，然后把这个计算值给子元素继承，子元素继承拿到的就是最终的值了。

此时子元素设置font-size就对其line-height无影响了。

例1：当line-height:1.5 时：

body{ font-size:14px; line-height:1.5; }
h1{ font-size:26px; }

实际结果为：

body的行高为14*1.5=21px

h1的行高为26*1.5=39px

例2：当line-height:150% 时：

body{ font-size:14px; line-height:150%; }
h1{ font-size:26px; }

实际结果为：

body的行高为14*150%=21px

h1的行高为直接继承body的行高，为21px

转载地址：

http://www.cnblogs.com/mguo/p/3161277.html

转载于:https://www.cnblogs.com/yzhihao/p/9390760.html

line-height:1.5和line-height:150%的区别相关推荐

android.view.InflateException: Binary XML file line #7: Binary XML file line #7
错误如下 11-21 08:19:44.040 3608-3608/com.leon.oldrecyclerview E/AndroidRuntime: FATAL EXCEPTION: main ...
android Binary XML file line #1: Binary XML file line #1: Error inflating class x 问题详解
话不多少,上错误堆栈: Process: com.mci.smagazine, PID: 25065java.lang.RuntimeException: Unable to start activi ...
vty 虚拟终端连接 line vty 0 4 和line vty 5 15 区别
在思科交换机Catalyst 2950上show run下发现有两个line vty line vty 0 4 和line vty 5 15 分别有相应密码 .. 请问这两个有什么区别? VTY是Ci ...
[css] body{height:100%}和html,body{height:100%}有什么区别？为什么html要设置height:100%呢，html不就是整个窗口吗？
[css] body{height:100%}和html,body{height:100%}有什么区别?为什么html要设置height:100%呢,html不就是整个窗口吗? html是body的父 ...
android line分享代码,Android实现Line登录分享
一.获取参数 1.注册登录Line开发者账号在Line官网并找不到注册地方,可以通过Line APP进行注册,注册之后进入Line开发者官网: 2.创建应用 3.创建完成在Channel setti ...
python line strip_关于python 的line.strip()方法
测试文本 abc abcd show me the money 代码一: def showfile (filepath): startTime=datetime.datetime.now() f=op ...
android.view.InflateException: Binary XML file line #1: Binary XML file line #1: Error inflating
android.view.InflateException: Binary XML file line #1: Binary XML file line #1: Error inflating cla ...
From line 6, column 36 to line 6, column 71: Cannot apply ‘-‘ to arguments of type ‘＜VARCHAR(214748
报错信息: From line 6, column 36 to line 6, column 71: Cannot apply '-' to arguments of type '<VARCHA ...
line vty 0 4 和line vty 5 15 有什么区别
在思科交换机Catalyst 2950上show run下发现有两个line vty line vty 0 4 和line vty 5 15 分别有相应密码 .. 请问这两个有什么区别? VTY是Ci ...
Vue 关于ESLint语法规范报错：Line 10 exceeds the maximum line length of 100
ESLint语法报错最近在使用vue-cli4创建项目,在项目编译时,报出来了一些语法错误; 因为我使用的是bootstrap组件,所以在一行引用时报出来: Line 10 exceeds the ...

line-height:1.5和line-height:150%的区别

line-height:1.5和line-height:150%的区别相关推荐

最新文章

热门文章