input[type=radio],input[type=checkbox] { display: inline-block; vertical-align: middle; width: 20px; height: 20px; margin-left: 5px; -webkit-appearance: none; background-color: transparent; border: 0; outline: 0 !important; line-height: 20px; color: #d8d8d8; } input[type=radio]:after { content: ""; display:block; width: 20px; height: 20px; border-radius: 50%; text-align: center; line-height: 14px; font-size: 16px; color: #fff; border: 2px solid #ddd; background-color: #fff; box-sizing:border-box; } input[type=checkbox]:after { content: ""; display:block; width: 20px; height: 20px; text-align: center; line-height: 14px; font-size: 16px; color: #fff; border: 2px solid #ddd; background-color: #fff; box-sizing:border-box; } input[type=checkbox]:checked:after { border: 4px solid #ddd; background-color: #37AF6E; } input[type=radio]:checked:after { content: "L"; transform:matrix(-0.766044,-0.642788,-0.642788,0.766044,0,0); -webkit-transform:matrix(-0.766044,-0.642788,-0.642788,0.766044,0,0); border-color: #37AF6E; background-color: #37AF6E; }

<input id="credit_input" type="radio" tabindex="1" name="reason" value="1" checked="">
<label class="reason_label" for="credit_input"></label>
<img src="/asset/img/icon_weixinpay.png" alt="">

type="radio"样式修改的更多相关文章

  1. checkbox/radio 样式修改

    只改颜色 input[type=radio],input[type=checkbox] { display: inline-block; vertical-align: middle; width: ...

  2. 小程序radio样式修改

    .city-radio-group-label .city-label-radio {    //label样式   padding: 15rpx 50rpx;   position: relativ ...

  3. 新 radio样式修改

    https://blog.csdn.net/qq_41617704/article/details/80973966

  4. 修改 input[type="radio"] 和 input[type="checkbox"] 的默认样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

  5. 定制 input[type="radio"] 和 input[type="checkbox"] 样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

  6. input[type="radio"]自定义样式

    input为radio时,虽然会有默认选中的样式,但是并不符合大多数项目的需求,我们的目标是可以随心所欲自定义它的样式.怎么做呢?其实很简单,只要抓住3点.分别是1.label 2.隐藏自带样式 3. ...

  7. 自定义input[type="radio"]的样式

    对于表单,input[type="radio"] 的样式总是不那么友好,在不同的浏览器中表现不一. 为了最大程度的显示出它们的差别,并且为了好看,首先定义了一些样式: <fo ...

  8. 纯css兼容个浏览器input[type='radio']不能自定义样式

    各个浏览器对于表单input[type='radio'].input[type='checkbox']的样式总是各有差异   //html <div class="remember-a ...

  9. 如何更改 iOS 和安卓浏览器上的 input[type="radio"] 元素的默认样式?

    Safari 上的默认样式是这样的, 背景颜色可以使用background-color改变,但中间那个点始终无法去掉. 我查了一些jQuery插件,如iCheck.js,但是那说明写得我都看不明白,根 ...

随机推荐

  1. 利用pandas库中的read_html方法快速抓取网页中常见的表格型数据

    本文转载自:https://www.makcyun.top/web_scraping_withpython2.html 需要学习的地方: (1)read_html的用法 作用:快速获取在html中页面 ...

  2. centos7系统修改内核

    修改centos6的内核启动顺序,只需要修改/etc/grub.conf 里的default项配置即可.那么centos7系统该如何修改呢? 下面就centos7系统修改内核,做如下记录: 一般在编译 ...

  3. mysql优化sql语句

    mysql优化sql语句   常见误区   www.2cto.com   误区1:   count(1)和count(primary_key) 优于 count(*)   很多人为了统计记录条数,就使 ...

  4. 1009MySQL数据库InnoDB存储引擎Log漫游

    00 – Undo Log Undo Log 是为了实现事务的原子性,在MySQL数据库InnoDB存储引擎中,还用Undo Log来实现多版本并发控制(简称:MVCC). - 事务的原子性(Atom ...

  5. owin-startup方法

    owin在根目录下有这个startup.cs文件,里面有个startup方法,这个和global.asax有什么区别呢? 测试一下执行顺序,是先执行了global.asax文件,再执行了startup ...

  6. Linux磁盘分区方案(转)

    硬盘分区的各个分区的意义 尽管可以根据我们已经提到的分区原则,Linux装在一个单一的大分区中,但更好的主意是将它分开.综合了单一分区的简单性和多分区的灵活性,我们推荐以下配置.请注意:如果你想安装L ...

  7. 【转】三年后再反思我的" Java Web项目管理得失谈"

    原文: http://blog.csdn.net/csfreebird/article/details/7561189 这篇文章介绍的经验心得不错,故转载之. 三年前,我写了 JavaWeb项目管理得 ...

  8. linux 线程切换效率与进程切换效率相差究竟有多大?

    Author:DriverMonkey Mail:bookworepeng@Hotmail.com Phone:13410905075 QQ:196568501 Are Linux threads t ...

  9. Hadoop作业性能指标及參数调优实例 (三)Hadoop作业性能參数调优方法

    作者: Shu, Alison Hadoop作业性能调优的两种场景: 一.用户观察到作业性能差,主动寻求帮助. (一)eBayEagle作业性能分析器 1. Hadoop作业性能异常指标 2. Had ...

  10. ASIHTTPRequest框架的简单使用

    ASIHttpRequest是一款及其强劲的HTTP訪问开源项目.让简单的API完毕复杂的功能,如:异步请求,队列请求,GZIP压缩.缓存,断点续传,进度跟踪,上传文件.HTTP认证.在新版本号中,还 ...