专注连锁门店会员营销管理系统
线上+线下+进销存+收银+会员微信小程序button组件自定义样式实例教程
2020-09-27 作者：秩名
在开发小程序时，我们可以将页面的分享按钮做成好看的图片按钮，有很多种样式，下面为大家介绍小程序button组件自定义样式实例教程。
背景颜色
wxml代码
<button class='btn' bindtap='sumbit' >确定</button>
wxss代码
.btn {
width: 90%;
margin-top: 30rpx;
background-color: #FFCC00;
color: #FFF;
}
background-color属性是修改背景颜色的，color是修改字体颜色的，这里注意：如果组件里面写 type='....'，修改背景颜色会无效，例如以下代码：
<!--修改背景颜色无效-->
<button class='btn' bindtap='sumbit' type='primary'>确定</button>
按钮去边框
小程序里提供的button组件默认带有边框，去掉按钮边框只需要在wxss样式代码中添加：
.btn::after {
border: 0;
}
按钮点击时的背景颜色
wxml代码
<button class='btn' bindtap='sumbit' hover-class='btn_hover'>确定</button>
wxss代码
.btn_hover {
background-color: pink;
}
这里，hover-class是重点，小程序文档中这样解释这个属性：
类型：String
默认值：button-hover
说明：指定按钮按下去的样式类。当hover-class='none'时，没有点击效果。
HiShop小程序工具提供多类型商城/门店小程序制作，可视化编辑 1秒生成5步上线。通过拖拽、拼接模块布局小程序商城页面，所看即所得，只需要美工就能做出精美商城。
线上+线下+进销存+收银+会员门店零售管理好帮手
-
极速收银管理
门店能实现快速收银，提升门店经营效率。
-
进销存管理
系统自带进销存管理，更好管理库存销售。
-
软硬件一体化
配备收银硬件一站式整体服务。
收 银 会员管理 库存管理 商品管理 交接班 数据报表 营销促单 售后处理 多种收款
获取报价推荐文章
-
2021年5种不同的小程序开发框架 对比
最新消息总结，开发一个小程序我们可以选择的第三方框架有5种，大家比较熟悉的有美团小程序框架mpvue，还有组件化框架等...
-
小程序生成分享链接怎么弄？微信小程序获取分
最近在调研小程序的分享能力，本篇文档主要是调研小程序关于分享方面的玩法，目的是学习小程序在项目应用以及玩法链上...
-
微信小程序定位权限开启或关闭怎么控制
许多人在使用小程序，会有一个很麻烦的事情，就是使用过小程序之后，会不断的发送自己的定位消息，那么这个小程序的...
-
微信小程序调用内置照相机实现拍照及图片上传
一款小程序，很多时候需要调用内置的照相机，实现拍照并图片上传，那么要如何实现呢？...
-
分销系统小程序需包含哪些核心模块？
分销系统小程序需包含哪些核心模块? 分销系统小程序是借助社交关系链实现产品推广与销售的工具，其核心模块的设计直接...
-
小程序商城vs微商城，功能、体验的对比
小程序商城vs微商城，功能、体验的对比 在数字化商业浪潮中，微商城和小程序商城已成为商家开拓线上业务的热门选择。二...
-
如何从0到1做分销？90%品牌在用的裂变模式
如何从0到1做分销?90%品牌在用的裂变模式 分销，简单说就是品牌或商家通过发展分销者，让他们利用自身资源推广产品，达...
-
5种常见的小程序类型，看看你适合做哪种
5种常见的小程序类型，看看你适合做哪种 小程序类型商城是一种基于小程序平台的在线购物系统，它让商家能通过小程序为...
-
分销小程序的6大主流模式推荐
分销小程序的6大主流模式推荐 分销小程序，是基于微信小程序开发的电商解决方案，借助微信庞大用户基础，商家将商品推...
-
从0到上线，日化用品小程序商城搭建6步
从0到上线，日化用品小程序商城搭建6步 日化用品小程序，为消费者提供了便捷的购物方式，也为商家开拓了线上销售渠道。...
长沙总部热线
4006-089-731
北京公司
4006-601-982
深圳公司
4008-400-198
一对一咨询
