[分享]css两个样式并排

在CSS中，可以使用float属性来让两个元素并排显示。比如下面这个例子：div { float: left; width: 50; } 以上代码中，我们将div元素设置为浮动到左侧，并占据父元素宽度...

在CSS中，可以使用float属性来让两个元素并排显示。比如下面这个例子：

div {
  float: left;
  width: 50%;
} 

以上代码中，我们将div元素设置为浮动到左侧，并占据父元素宽度的50%。这样，如果我们在父元素中再放入另一个div元素，它也会并排显示在左侧。

但是，仅仅使用float属性还不能保证元素的稳定性，因为在某些情况下这会影响到其他元素的位置。为此，我们可以使用另一个属性——display:inline-block。

div {
  display: inline-block;
  width: 50%;
  vertical-align: top;
} 

以上代码中，我们将div元素设置为行内块元素，使它可以使用width属性控制宽度，并设置vertical-align:top来让两个元素上下对齐。这样，即使我们不使用浮动属性，这两个元素也能稳定地并排显示了。