1. 父级line-height=30px的情况,子元素line-height是多少
<div class="con">
<p>一段关于line-height的故事</p>
</div>
.con {
font-size: 20px;
line-height: 30px;
}
p {
/* 此时继承line-height:30px */
font-size: 16px;
}
2.父级line-height=1.5倍的情况,子元素line-height是多少
<div class="con">
<p>一段关于line-height的故事</p>
</div>
.con {
font-size: 20px;
line-height: 1.5;
}
p {
/* // p的line-height: 1.5*16px =24px ; 子元素的font-size*1.5*/
font-size: 16px;
}
3.父级line-height=200%的情况,子元素line-height是多少
<div class="con">
<p>一段关于line-height的故事</p>
</div>
.con {
font-size: 20px;
line-height: 200%;
}
p {
/* // p的line-height: 20px * 200% =40px; 父元素的font-size*200% */
font-size: 16px;
}