相信很多小伙伴在开发小程序的时候都会碰到小程序Button默认样式的困扰,在重设样式的时候需要一次次的设置

分享一个自己在开发中的小方法:

CSS all 简写属性 将除 unicode-bidi 与 direction 之外的所有属性重设至其初始值,或继承值

而且 all 属性没有初始值

MDN例子附上 https://developer.mozilla.org/zh-CN/docs/Web/CSS/all

button{
all:initial;
 position: relative;
}

注意点1:button是行内元素,需要设置宽度的时候记得改为块级元素,否则宽度无效喔

注意点2:初始化完后,position会被设置为static,可能会导致button触发范围的异常,最好设置除static外的属性值。

微信小程序 buton清除默认样式的更多相关文章

  1. 微信小程序去除Button默认样式

    在小程序开发过程中,使用率蛮高的组件button,因为经常要去除默认样式,然后再自定义样式,所以经常写,自己也总结分享一下简单的实现步骤. (一)实现效果1.实现前(默认样式): 2.实现后(去除默认 ...

  2. 更改微信小程序的组件默认样式

    checkbox /*checkbox 整体大小  */ .checkbox {      width: 12%;      /* height: 240rpx; */ } /*checkbox 选项 ...

  3. 微信小程序的布局css样式

    微信小程序的布局css样式width: fit-content;font-size:20px;      /*设置文字字号*/color:red;           /*设置文字颜色*/font-w ...

  4. 微信小程序wxml和wxss样式

    对于css不熟悉的android程序员来说,开发微信小程序面临的一个比较困难的问题就是界面的排版了.微信小程序的排版就跟wxml和wxss有关了,它们两者相当于android的布局文件,其中wxml指 ...

  5. 微信小程序 JS动态修改样式

    微信小程序这个坑啊,js动态修改样式,我们并不能用js或者jq 轻轻松松一行代码搞定.或者用removeClass addClass 来修改样式. 以下是一种动态修改样式的方法,原理是绑定数据,然后动 ...

  6. 微信小程序中placeholder的样式

    通常,现代浏览器大多支持::placeholder选择器,用于设置placeholder的样式,但是在微信小程序中并不支持这种方式,而是提供了一个专门的属性(placeholder-class)来处理 ...

  7. 微信小程序页面阻止默认滑动事件

    在页面上要加入一个悬浮的按钮,这个按钮需要可以拖动,在元素中使用catchtouchstart,catchtouchmove,catchtouchend来控制悬浮按钮的拖动,但是在ios系统中,微信小 ...

  8. 微信小程序,动态改变样式

    小程序目前没有修改样式api,但是可以利用数据绑定实现动态改变样式,可以用view标签模拟page然后改变view标签的样式,以下案例演示了如果改变page背景颜色: <view class=& ...

  9. 微信小程序button选中改样式-实现单选/多选

    小程序实现多button单选/多选 红色为选中状态 单选 多选 ①wxss /* pages/button-select/button-select.wxss */ .button_container ...

随机推荐

  1. CentOS7.6手动编译httpd-2.4.25

    手动编译httpd-2.4.25 系统:CentOS7.1810 httpd:2.4.25 编译时报错解决技巧:报什么错,就装这个错误的devel,比如报http2错误,就yum search htt ...

  2. python机器学习——逻辑回归

    我们知道感知器算法对于不能完全线性分割的数据是无能为力的,在这一篇将会介绍另一种非常有效的二分类模型--逻辑回归.在分类任务中,它被广泛使用 逻辑回归是一个分类模型,在实现之前我们先介绍几个概念: 几 ...

  3. java 实现一个死锁

    /** * 死锁:两个或多个线程在执行过程中,相互争夺资源而造成的一种互相等待的现象 * 实现一个死锁 * <p> * <p> * 查看死锁 * 1. 在当前类的文件夹下,打开 ...

  4. 创建基于OData的Web API - Knowledge Builder API, Part IV: Write Controller

    基于上一篇<创建基于OData的Web API - Knowledge Builder API, Part III:Write Model and Controller>,新创建的ODat ...

  5. hdu 3342 Legal or Not (topsort)

    Legal or NotTime Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...

  6. ArcGIS API For Javascript :读取 CSV 文件的方法

    我们临时会遇到一些测试数据,通常从数据库中以 CSV 格式导出.最简单实用的方法就是使用 ajax 去读取文件,记得引入 jQuery . 例如,在<ArcGIS JS API :新增一个热力图 ...

  7. 实现websocket 主动消息推送,用laravel+Swoole

    近来有个需求:想实现一个可以主动触发消息推送的功能,这个可以实现向模板消息那个,给予所有成员发送自定义消息,而不需要通过客户端发送消息,服务端上message中监听传送的消息进行做相对于的业务逻辑. ...

  8. 就该这样理解 OSI 七层参考模型、浅谈不同局域网之间的通信

    简介 说到OSI参考模型,理解网络与网络之间的关系,不说太深入难以理解的东西,只求能最大程度上理解与使用. 参考模型是国际标准化组织(ISO)制定的一个用于计算机或通信系统间互联的标准体系,一般称为O ...

  9. 在阿里云服务器中配置JDK、tomcat、mysql

    阿里云服务器搭建配置 linux命令:参考:https://www.cnblogs.com/itdansan/p/8545187.html cat 文件名: 查看文件内容 ctrl+D : 退出查看 ...

  10. (四十五)golang--反射

    反射基本介绍: (1)反射可以在运行时动态获取变量的各种信息,比如变量的类型.类别: (2)如果是结构体变量,还可以获取结构体本身的信息(包括结构体字段.方法): (3)通过反射,可以修改变量的值,可 ...