用CSS如何实现布局button在左右对齐的效果？

发布时间：2022-11-14 11:19:57 所属栏目：编程来源：

导读：　　在很多网站页面上，我们都能看到两个button左右对齐的布局，这篇文章我们就来看看这是怎样做的，这里实现的是css布局两个button在同父标签中左右两侧分布的方法，感兴趣的朋友可以参考，实现效果及代码如下。

　　在很多网站页面上，我们都能看到两个button左右对齐的布局，这篇文章我们就来看看这是怎样做的，这里实现的是css布局两个button在同父标签中左右两侧分布的方法，感兴趣的朋友可以参考，实现效果及代码如下。

　　布局代码
　　
　　<view class="grace-footer" style="width:100%;" slot="gFooter">
　　 <view style="float:right;width:50%">
　　    <button type="primary" style="line-height: 85rpx; margin: 25rpx; " @click="saveService(scanKay,tableList)">提交</button>
　　 </view>
　　 <view style="float:left;width:50%">
　　 <button type="warn" style="line-height: 85rpx; margin: 25rpx;" @click="removeService()">重置</button>
　　 </view>
　　
　　</view>
　　style="float:right;width:50%"
　　就是在父标签容器中的右侧，并且占据50%宽度
　　
　　style="float:left;width:50%"
　　就是在父标签容器中的左侧侧，并且占据50%宽度
　　
　　grace-footer是GraceUI 引入的css代码是效果是底部导航
　　
　　.grace-footer{
　　     position:fixed;
　　     z-index:2; left:0;
　　     bottom:0;
　　     background:#FFFFFF;
　　     width:750rpx;
　　     overflow:hidden;
　　     box-shadow:1px 1px 6px #888;
　　}

（编辑：PHP编程网 - 湛江站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

什么是生成树生成树	Python __repr__ 方法
C++ static静态成员变	C++继承时的名字遮蔽问

用CSS如何实现布局button在左右 对齐的效果？

用CSS如何实现布局button在左右对齐的效果？