line-height:150%与1.5的区别所在

line-height:150% 是继承父元素的距离

line-height:1.5  是计算各子元素的距离

  1. 当line - height 为百分比时:
div{

font-size:14px; line-height:150%;

}

p{

font-size:21px;

} 

结果就是:

div{

line-height:21px;//14*150%=21

}

p{

line-height:21px;//继承父元素

}

父级div标签:  

子集p标签:

2、当line-height 为 1.5时:

div{

    font-size:14px;

    line-height:1.5;

}

p{

    font-size:26px;

}

.p{

    font-size:21px;

}

结果就是:

div{

line-height:39px;//26*1.5 = 39

}

p{

line-height:39px;//26*1.5=39

}

.p{

  line-height:31px;//21*1.5 = 31.5(约等于31)

}

父级div标签:

子集p标签:

子集p标签类名p:

显而易见,按需使用即可

猜你喜欢

转载自blog.csdn.net/qq_37818095/article/details/81303354