css如何设置div子容器之间的间距

html-css029

css如何设置div子容器之间的间距,第1张

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<style>标签中,输入css代码:.sub{margin-top: 30px}。

3、浏览器运行index.html页面,此时3个div子子容器的垂直间距被统一设置为了30px。

div的实际高度为margin+border+padding+height

也就是外边距+边框线+内边距+元素自身的高度。

例如:

div{margin: 10px padding: 10px border-width:10px height:50px }

那么  这个div实际占用页面的高度就是110px

设一个有两个div,一大一小,小的div在大的div里面,而小的div和大div直接的距离就叫外边距,用margin、margin-left、margin-right、margin-top、margin-bottom来设置距离,如margin:10px。而小div和小DIV里面的文字之间的距离就叫内边距,用padding来设置,如同margin一样。