[分享]css六个盒子分两排

在 CSS 中，每个元素都可以被看做是一个盒子。这个盒子有六个部分，分别是：

margin-top
border-top
padding-top
content
padding-bottom
border-bottom
margin-bottom

可以通过设置这六个部分的属性，来调整元素的大小、位置等。

如果需要将六个盒子分成两排，则需要使用 display 属性和 height 属性。具体代码如下：

.box {
  display: inline-block;
  height: 100px;
}

.box:first-child {
  margin-right: 20px;
}

上述代码中，我们将每个盒子设置为 inline-block，这样它们可以在同一行显示。同时，我们也为每个盒子设置了一个 height 属性，使它们在高度上保持一致。

为了在两排中分别显示这六个盒子，我们将其中的一个盒子加上 :first-child 选择器，并设置其右边距为 20 像素，这样它就可以与下面一排的第一个盒子保持间距。

通过这样的设置，我们就可以自由地将六个盒子分成两排，并且在样式上进行调整。