让两个按钮并列显示,中间留下适当的空
时间: 2024-02-29 15:52:30 浏览: 187
您可以使用 flex 布局来使两个按钮并排显示,并在它们之间留下适当的空隙。以下是一个简单的 CSS 代码示例:
```css
.btn-group {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 20px;
}
.btn-group button {
flex-grow: 1;
margin-right: 10px;
}
```
您可以将此代码添加到您的 CSS 文件中,或将其添加到您的 HTML 文件中的 `<style>` 标签中。然后将您的两个按钮包装在一个 `<div>` 元素中,并将 `<div>` 元素的 `class` 属性设置为 `btn-group`,如下所示:
```html
<div class="btn-group">
<button>按钮1</button>
<button>按钮2</button>
</div>
```
这将使您的两个按钮并排显示,并在它们之间留下适当的空隙。您可以通过修改 `margin-top` 和 `margin-right` 属性来调整按钮之间的间距。
阅读全文