首页 > 微信 > 详细

微信小程序的button按钮设置宽度无效

时间:2020-06-10 16:39:39      阅读:318      评论:0      收藏:0      [点我收藏+]

标签:标签   order   href   blank   ont   代码示例   

亲,你是不是也遇到了微信小程序的button按钮设置宽度无效。让我来告诉你怎么弄

方法1.

样式中加入!important,即:width: 100% !important;

wxss代码示例

.login-btn {
    font-size: 16px;
    width: 100% !important;
    font-weight: 400;
    color: #fff;
    border-radius: 4px;
    border:1px solid rgba(254,50,50,1);
    background:linear-gradient(180deg,rgba(241,94,94,1) 0%,rgba(222,62,62,1) 100%);
}

  wxml代码示例:

<button class="login-btn" bindclick="login">登录</button>

 效果如下图哦亲。  

技术分享图片

 

方法2.

标签内,使用style

wxml代码示例:

<button class="login-btn" bindclick="login" style="width:100%">登录</button>

  

方法3.

删除app.json的配置"style": "v2",不过这个不推荐哦,亲

方法2、方法3参考:https://blog.csdn.net/Echo_cxl/article/details/104783105

 

微信小程序的button按钮设置宽度无效

标签:标签   order   href   blank   ont   代码示例   

原文:https://www.cnblogs.com/guxingzhe/p/13086068.html

(0)
(0)
   
举报
评论 一句话评论(0
© 2014 bubuko.com 版权所有 鲁ICP备09046678号-4
打开技术之扣,分享程序人生!
             

鲁公网安备 37021202000002号