关于 body设置宽高的问题
来源:9-9 外边距
浩淼6924806
2021-09-22 20:02:20
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<style type="text/css">
#one{
margin-top: 40px;
}
.two{
display: inline-block;
margin-top: 40px;
margin-left: 40px;
background-color: yellow;
width: 300px;
height: 100px;
}
body{
display: inline-block;
width: 400px;
height: 500px;
background-color: pink;
}
</style>
</head>
<body>
<div id="one">
<div class="two">HTML</div>
<div class="two">CSS</div>
<div class="two">JavaScript</div>
</div>
</body>
</html>
我给body限定了宽高,为什么加上背景颜色之后是铺满的呢?没有宽高了
1回答
好帮手慕小班
2021-09-23
同学你好,因为当html不设置背景时,body的背景将作为整个浏览器的背景色,而不是body标签自己的背景色。当设置html背景色后,body的背景色就变成了body自己的背景色,此时html的背景色将被浏览器获取成为浏览器的背景色。
所以,要让body的背景色渲染范围只在设置的body范围之内,我们需要对html进行背景样式的设置,比如
祝学习愉快~
相似问题
回答 1
回答 1