学习笔记——微信小程序button组件

最新推荐文章于 2024-08-28 13:51:38 发布

顺遂时光

最新推荐文章于 2024-08-28 13:51:38 发布

阅读量761

点赞数 3

文章标签：学习笔记微信小程序

本文链接：https://blog.csdn.net/m0_63309256/article/details/136568088

版权

本文介绍了在微信小程序开发中如何使用wxss设置button样式失效的情况，推荐使用内联style自定义宽高。此外，还详细讲解了type、plain和size属性的应用，包括default、warn样式和mini尺寸。

摘要由CSDN通过智能技术生成

微信小程序当中通过wxss来设置button的宽高值并不起效果，而size属性却只有两个合法值，当我们想要自定义大小时则：在标签中直接写 style即可：

<button style="width: 90vw;height: 8vh;background-color: aqua;"> 在线客服222 </button>

1、type 属性来配置按钮的基本显示样式，可以是 default、primary、warn

2、plain 属性默认false ，表示按钮背景填充，为true时，背景不填充，只有边框文字

3、size 用来配置按钮的大小可取值为 mini、default

<button class="btn" bindtap="onDefaultButtonClick" type="warn">
    warn 样式 
</button> 
<button class="btn" bindtap="onDefaultButtonClick" type="warn" plain="true"> 
    warn 样式 
</button>
<button class="btn" bindtap="onDefaultButtonClick" type="warn" plain="true" size="mini">         
    warn mini 样式 
</button>