元素与其它元素之间的距离可以使用边界（margin）来设置。边界也是可分为上、右、下、左。如下代码：
div{margin:20px 10px 15px 30px;}也可以分开写：
div{
margin-top:20px;
margin-right:10px;
margin-bottom:15px;
margin-left:30px;
}如果上右下左的边界都为10px;可以这么写：
div{ margin:10px;}如果上下边界一样为10px，左右一样为20px，可以这么写：
div{ margin:10px 20px;}总结一下：padding和margin的区别，padding在边框里，margin在边框外。
练习
新建示例页面demo.html，示例代码如下
我来试试：为id名称为box1的div元素加入30象素的下边距
1、在示例页面代码中第12行输入下列代码：
#box1{margin-bottom:30px;}示例代码
<!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;
}
</style>
</head>
<body>
<div id="box1">box1</div>
<div id="box2">box2</div>
</body>
</html><!-- V型知识库 -->
此文章本站原创，地址 https://www.vxzsk.com/1384.html
转载请注明出处！谢谢！
感觉本站内容不错，读后有收获？小额赞助,鼓励网站分享出更好的教程
上一篇：9.7、CSS盒模型--填充
下一篇：5.7:Hive综合案例实战
^