小程序中两个button放在同一行
时间: 2024-04-29 15:23:15 浏览: 163
CSS 将两个button按钮垂直+水平居中
可以使用flex布局来实现两个button放在同一行。
在父元素中设置display:flex,然后设置子元素的flex属性即可实现同一行排列。
示例代码如下:
```
<view class="container">
<view class="button-wrapper">
<button class="button">Button 1</button>
<button class="button">Button 2</button>
</view>
</view>
<style>
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
.button-wrapper {
display: flex;
}
.button {
margin-right: 20rpx;
}
</style>
```
在上面的代码中,我们设置了一个父元素container,使用flex布局来实现居中对齐,并设置了一个子元素button-wrapper,也使用了flex布局来实现同一行排列。每个button元素都有一个margin-right属性,用于在两个button之间添加一些间距。
阅读全文