[分享]css两个盒子在一条线上

在CSS中，设置两个盒子在一条线上是一个很常见的需求。此时，我们可以使用display属性来实现。.box1, .box2 { display: inlineblock; } 这里，我们将两个盒子的d...

在CSS中，设置两个盒子在一条线上是一个很常见的需求。此时，我们可以使用display属性来实现。

.box1, .box2 {
  display: inline-block;
} 

这里，我们将两个盒子的display属性设为inline-block，这样它们就会像内联元素一样排列在同一行内。

需要注意的是，如果两个盒子之间有空格或者换行符，它们之间的距离会有一个空格的宽度。如果我们希望两个盒子之间没有空隙，可以将它们紧挨着写。

<div class="box1">Box 1</div><div class="box2">Box 2</div> 

这样，两个盒子就会紧贴在一起了。