[分享]css两个按钮一行显示出来

想要实现在一行显示两个按钮，我们需要对CSS进行一些简单的调整。.button { display: inlineblock; width: 50; } / 若两个按钮不在同一父元素中，需使用此样式 ...

想要实现在一行显示两个按钮，我们需要对CSS进行一些简单的调整。

.button {
  display: inline-block;
  width: 50%;
}

/* 若两个按钮不在同一父元素中，需使用此样式 */
.button-container {
  display: flex;
  justify-content: space-between;
} 

上述代码中，我们使用了inline-block属性使按钮能够在同一行内显示。同时，我们将按钮宽度设为50%，使它们平分一行。若两个按钮不在同一父元素中，可以使用flex布局的justify-content属性使两个按钮间距距离增大，使其在同一行内显示。

其他实现方式包括使用float属性或者绝对定位等方法。但需要注意的是，这些实现方式需要进一步的调整以确保页面布局的稳定性。

.button {
  float: left;
  width: 50%;
}

/* 使用绝对定位实现 */
.button-container {
  position: relative;
}

.button {
  position: absolute;
  top: 0;
  left: 0;
  width:50%;
}

.button:last-child {
  left: 50%;
} 

总之，实现在一行显示两个按钮并不是一件困难的事情，只需要简单地调整CSS属性就可以达到目的。