Question

我想知道如何水平放置2个按钮，它们之间有空格。

有人可以共享任何简单的html和css代码段吗？

我找不到任何好的例子

Answer 1

有多种方法，这里有一个非常简单的浮点示例：

<button class="button-1">Example</button>
<button class="button-2">Example 2</button>

button{
  float: left;
}

.button-2{
  margin-left: 15px;
}

我强烈建议你去w3school CSS教程，它会教你惊人的事情。

注意：如果使用按钮，您甚至不需要浮动它们，默认情况下它们会相互靠近。但是对于像div这样的元素，你需要浮动。

Answer 2

取决于您在页面的其余部分尝试实现的目标，包括布局以及您希望应用于其他按钮和其他HTML控件的样式。

HTML：

<button>Button 1</button>
<button>Button 2</button>

CSS：

button {
    margin-left:20px;
}

上面的HTML / CSS将在每个按钮的左侧放置一个20像素的边距。如果您只需将其应用于一个按钮，那么您需要一个单独的类或一些内联样式来执行此操作。

E.g。

CSS：

.buttonSpaced {
    margin-left:20px;
}

然后只将此样式应用于第二个按钮。

HTML：

<button class="buttonSpaced">Button 2</button>

或者你可以直接进行内联，如果它不太可能再次使用......

<button style="margin-left:20px;">Button 2</button>