为什么写#box1{margin-bottom:30px;} 可以实现两个div而不写#box1{margin-bottom:30px;}#box2{margin-bottom:30px;}
cym01494
2017-06-27 11:16
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>边距</title>
<style type="text/css">
div{
width:300px;
height:300px;
border:1px solid red;
}
#box1{margin-bottom:30px;}
</style>
</head>
<body>
<div id="box1">box1</div>
<div id="box2">box2</div>
</body>
</html>
6回答
-
- san_point_water
- 2017-06-27 11:43:43
margin,对应的是盒子外边界的距离。至于为什么只设置一个，可以这样想：比如两个人a，b前后紧挨着，我只需要拉开a或者b的距离就可以实现把两人的距离来开。我们把a的后面定义为底部（bottom）或者b的前面定义为顶部（top），只要将a的bottom或者b的top拉开一段距离就可以了。对应box1,也是一样的。可以修改为 box2的top：30px；
-
- loucc
- 2017-06-27 11:41:10
因为只有两个，只要第一个有下边距就可以了。同理，如果有三个
<div id="box1">box1</div>
<div id="box2">box2</div>
<div id="box3">box3</div>，就写两个
#box1{margin-bottom:30px;}
#box2{margin-bottom:30px;}
-
- 慕九州6232576
- 2017-06-27 11:40:43
#box1{margin-bottom:30px;}
表示box1和下面box2间距是30px，而
#box2{margin-bottom:30px;}
表示和box2和下面边缘距离为30px，这是距离是无限大切且不可控，属于无效代码，效果和仅仅写
#box1{margin-bottom:30px;}
的效果一样的
-
- qq_不死鸟_5
- 2017-06-27 11:39:42
#box1{margin-bottom:30px;}，设置box1这个盒子的底部外边距为30个像素，即在box1和box2之间填充了30个像素的距离。#box2{margin-bottom:30px;}是设置box2这个盒子的底部外边距为30个像素，这是没必要的。
-
- 慕丝1216519
- 2017-06-27 11:35:43
边界距离就是元素与元素之间，因此只需要写一个box1就行了，默认的就是两box1与box2的距离。
-
- 镜里镜外都是谁
- 2017-06-27 11:35:18
box1的块级元素高度要再加上margin-bottom:30px; 意思 是在他的外下边界多了30px空间， 不加box2那是因为没有必要 你加下#box2{margin-bottom:30px;} 如果 再在下面添加元素就会发现位置又多了个30边距
<div id="box1">box1</div>
<div id="box2">box2</div>
<div id="box3">box3</div>
初识HTML(5)+CSS(3)-升级版
1225806 学习 · 18234 问题
相似问题