<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.box1{
line-height: 1.5;
font-size: 24px;
width: 200px;
height: 400px;
display: inline-block;
border: 2px solid #666666;
}
.box2{
border: 2px solid #666;
display: inline-block;
line-height: 150%;
width: 200px;
height: 400px;
font-size: 24px;
}
.box1 p{
font-size: 40px;
}
.box2 p{
font-size: 40px;
}
</style>
</head>
<body>
<div class="box1">
line-height:1.5
<p>我的font-size是40px,哈哈哈哈</p>
</div>
<div class="box2">
line-height:150%/1.5em
<p>我的font-size是40px,哈哈哈哈
</p>
</div>
<script>
</script>
</body>
</html>为什么第二个div上有一段间隙,和第一个没有对齐
1 回答
已采纳
qq_运着篮球的挨踢侠客丶_0
TA贡献15条经验 获得超3个赞
150%是根据父元素的字体大小计算出行高,并且子元素依然沿用这个计算后的行高。
1.5则是根据子元素自己字体的大小去乘以1.5来计算行高。
对齐方法 .box2 vertical-align: top;
- 1 回答
- 1 关注
- 1355 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消