关于父级高度问题
来源：3-3 相对和绝对定位3
慕用8117612
2021-08-08 22:12:34
课程里面的那个例子
虽然所有div的高度都设成了100px，但是父级div有三个子div，根据之前课程所学，不应该是父级div的高度被“破坏”而导致高度变为300px吗？为什么还是100px
写回答
1回答
-
同学你好，因为css中设置代码中设置了所有div的高度为100px（包括父级div），所以虽设置三个子div高度的高度分别为100px，父级div的高度还是不会发生变化的；但是若未设置父级元素的高度，父级元素的高度则会变为300px，可使用如下代码进行测试：
html代码：
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div class="div0" >
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
</div>
</body>
</html>css代码：
.div1,.div2,.div3 { //仅设置三个子div的高度为100px
width: 100px;
height: 100px;
}
.div0 {
float: right;
border: black solid 5px;
}
.div1 {
background-color: red;
}
.div2 {
background-color: green;
}
.div3 {
background-color: blue;
}祝学习愉快~
0
相似问题