[分享]css两个div之间的距离

CSS是一种用于控制网页样式的语言，其主要功能之一就是控制元素在网页上的位置。在CSS中，我们可以使用margin属性来控制元素相互之间的距离。 在上面这段代码中，我们创建了两个相同大小的div元素...

CSS是一种用于控制网页样式的语言，其主要功能之一就是控制元素在网页上的位置。在CSS中，我们可以使用margin属性来控制元素相互之间的距离。

<div style="background-color: red; width: 100px; height: 100px;"></div>
<div style="background-color: blue; width: 100px; height: 100px; margin-left: 20px;"></div> 

在上面这段代码中，我们创建了两个相同大小的div元素，分别设置了不同的背景色并通过CSS控制了它们之间的距离。

在第二个div元素中，我们设置了margin-left属性为20px，这意味着从该元素的左侧边缘向右推了20px，与其相邻的元素就会产生20px的距离。

同样的，我们也可以在第一个div元素中使用margin-right属性来控制与第二个div元素之间的距离。

<div style="background-color: red; width: 100px; height: 100px; margin-right: 20px;"></div>
<div style="background-color: blue; width: 100px; height: 100px;"></div> 

在上面这段代码中，我们将margin-right属性设置为20px，使红色的div元素与蓝色的div元素之间产生了20px的距离。

通过使用margin属性，我们可以轻松地控制元素之间的距离，从而使网页看起来更好看和更整洁。