两个按钮水平布局,并占满一行
时间: 2023-07-13 11:36:57 浏览: 251
可以使用以下HTML和CSS代码实现两个按钮水平布局并占满一行:
```html
<div class="button-container">
<button>Button 1</button>
<button>Button 2</button>
</div>
```
```css
.button-container {
display: flex;
justify-content: space-between;
width: 100%;
}
.button-container button {
width: 45%;
}
```
在上述代码中,我们使用了一个包含两个按钮的容器,并将其设置为弹性布局。我们还使用了`justify-content`属性,将两个按钮置于容器的两端。最后,我们使用`width`属性将每个按钮的宽度设置为`45%`,以确保两个按钮在容器内均匀分布,并占满一行。
相关问题
安卓实现两个方形按钮并排,并且不占满一行
可以使用 LinearLayout 来实现两个方形按钮并排显示,并设置 layout_weight 属性来控制按钮的宽度。
以下是一个示例 XML 布局代码:
```xml
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button 1"/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button 2"/>
</LinearLayout>
```
在这个布局中,我们创建了一个水平方向的 LinearLayout,并在其中添加了两个 Button。每个按钮的 layout_weight 属性都设置为 1,这将使它们平均分配可用的宽度。同时,按钮的 layout_width 属性设置为 0dp,这将使其宽度由 layout_weight 属性控制。
这样,两个按钮就可以并排显示,且不会占满一行。
android 多个按钮居中,android 一行两个按钮居中 布局
要让多个按钮居中,可以使用 LinearLayout 布局,并将其设置为水平方向。然后,将布局的重心设置为居中,并将按钮的布局设置为居中。以下是一个示例代码:
```xml
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 1"
android:layout_gravity="center"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 2"
android:layout_gravity="center"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 3"
android:layout_gravity="center"/>
</LinearLayout>
```
如果您想要在同一行中居中两个按钮,可以像下面这样使用 LinearLayout 布局,并将其设置为水平方向。将布局的重心设置为居中,并将每个按钮的权重设置为 1,以便它们平均分配父容器的宽度。以下是一个示例代码:
```xml
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Button 1"
android:layout_weight="1"
android:layout_gravity="center"/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Button 2"
android:layout_weight="1"
android:layout_gravity="center"/>
</LinearLayout>
```
这将在屏幕中央水平放置两个按钮,它们将平均分配父容器的宽度。