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. [luogu3231 HNOI2013] 消毒 (二分图最小点覆盖)

    传送门 Description 最近在生物实验室工作的小T遇到了大麻烦. 由于实验室最近升级的缘故,他的分格实验皿是一个长方体,其尺寸为abc,a.b.c 均为正整数.为了实验的方便,它被划分为abc ...

  2. 使用pandas中的raad_html函数爬取TOP500超级计算机表格数据并保存到csv文件和mysql数据库中

    参考链接:https://www.makcyun.top/web_scraping_withpython2.html #!/usr/bin/env python # -*- coding: utf-8 ...

  3. Vue CLI 3.x 简单体验

    文档 中文文档 补充于02月10日 vue脚手架的3.x版本已经在开发中,现在还处于alpha版本.我们来看看有哪些变化. 使用 npm install -g @vue/cli 命名方式已经改为npm ...

  4. CentOS 7 x64下Apache+MySQL(Mariadb)+PHP5.6的安装

    每次搭建新服务器,都要来来回回把这些包再装一下,来来回回搞了不下20遍了吧,原来都是凭经验,配置过程中重复入坑是难免的,故写此文做个备忘.虽然有像xampp这样的集成包,但是在生产环境的Linux发行 ...

  5. 2767 Proving Equivalences 至少加几条边让全部图变成强连通模板题

    #include<stdio.h> #include<string.h> #define N 21000 struct node { int u,v,next; }bian[N ...

  6. Centos6.4建立本地yum源

    https://jingyan.baidu.com/article/e9fb46e1aed8207521f7662c.html

  7. HDU 2224 The shortest path

    The shortest path Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others ...

  8. [jQuery]$.get跨域提交不发送原因

    使用 $.ajax({ url: "http://pastebin.com/embed_js.php?i=sy9gt3FR", dataType: "jsonp" ...

  9. HDU 3007

    基本小圆覆盖模板题 #include <iostream> #include <algorithm> #include <cmath> using namespac ...

  10. adb命令查看报名和查看手机分辨率

    打开所要查看的应用包名: $ adb shell dumpsys activity top | head -n 10 TASK com.ss.android.article.news id=5 ACT ...