代码问题关于内外边距
来源：3-5 编程练习
源治泷谷
2020-04-27 15:08:54
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.content{
width:800px;
height:400px;
background-color: skyblue;
// padding-top:100px;
// box-sizing:border-box;
}
.top{
width:400px;
height:200px;
background-color: yellow;
margin-left:200px;
margin-top:100px;
}
</style>
</head>
<body>
<div class="content">
<div class="top"></div>
</div>
</body>
</html>
4回答
-
同学你好，
1、一个盒子如果没有上边距(padding-top)和上边框(border-top)，那么这个盒子的上边距会和其内部文档流中的第一个子元素的上边距重叠。所以同学设置了margin-top没有用呢。
2、子div在父div的里面，想要让子元素相对于父元素移动，要先给父元素加上相对定位，子元素绝对定位。
如下：
运行效果如下：
如果我的回答解决了你的疑惑，请采纳！祝学习愉快！
0 -
源治泷谷
提问者
2020-04-27
我对top添加margin发现，margin-top会使得包含top的content范围整体下移，margin-left仅使top本身右移，而content不变，margin-right margin-botton都没有效果 这怎么理解
0 -
源治泷谷
提问者
2020-04-27
margin-left 会使得top相对content右移 为什么margin-top会使得top content同时移动呢
0 -
源治泷谷
提问者
2020-04-27
为什么设置.top 外上距离会使得content一起变化呢，.top的外边距不是相对于content的吗
0
相似问题