亲,你是不是也遇到了微信小程序的button按钮设置宽度无效。让我来告诉你怎么弄
方法1.
样式中加入!important,即:width: 100% !important;
wxss代码示例
1
2
3
4
5
6
7
8
9
|
.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(
180
deg,rgba(
241
,
94
,
94
,
1
)
0%
,rgba(
222
,
62
,
62
,
1
)
100%
);
}
|
wxml代码示例:
1
|
<
button
class="login-btn" bindclick="login">登录</
button
>
|
效果如下图哦亲。
方法2.
标签内,使用style
wxml代码示例:
1
|
<
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