1、首先打开hbuilder软件,新建一个html文件,在html里面写入html结构,在给每个子div设置一个class属性。2、接着在上方的style标签中设置这个名叫div的class的css样式,这里把文字字号放大并加入了边框,然后就可以使用margin属性设置子容器之间的间距了,margin中前面的是设置上下间距,后面的则是左右间距,最后根据自己的需要设置即可。3、来到浏览器即可看到效果,三个div的间距都是20px。以上就是cs设置div子容器之间的间距的方法。
设定CSS控制元素内部的元素之间间距,首先需要理解的就是css中的margin和padding的意思和使用,具体用法,如图:
元素内部的间距,需要的就是有多个div的嵌套,或者说是有多个上下类的元素,通过给这些元素一个id或者是class,然后在用css来控制,具体看下代码:
<html>
<head>
<style>
#round{
width:400px
height:200px
}
#div2{
width:300px
height:50px
margin-top:10px //距离上边的距离是10px
margin-left:20px //距离左边的距离是20px
}
</style>
</head>
<body>
<div id="round">
<div id='div2'>
<p>测试文字</p>
</div>
</div>
</body>
</html>