input[type="radio"] {
width: 2rem;    
height: 2rem;
-webkit-appearance: none; /*清除复选框默认样式*/
background: url("../../assets/address/addressManagement-nocheck.png") no-repeat; /*复选框的背景图,就是上图*/
background-size: cover;
vertical-align: middle;
}
input[type="radio"]:checked {
-webkit-appearance: none; /*清除复选框默认样式*/
background: url("../../assets/address/addressManagement-check.png") no-repeat; /*复选框的背景图,就是上图*/
background-size: cover;
height: 2rem; /*高度*/
vertical-align: middle;
width: 2rem;
}

input框改变默认样式的更多相关文章

  1. 消除input框的默认样式

    input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...

  2. 伪元素改变date类型input框的默认样式实例页面

    CSS代码: ::-webkit-datetime-edit { padding: 1px; background: url(/study/image/selection.gif); } ::-web ...

  3. 用纯css改变下拉列表select框的默认样式(转)

    用纯css改变下拉列表select框的默认样式 分享到 分类 JS学习   关键字 前端   发布 kris  2015-04-01 注意 转载须保留原文链接,译文链接,作者译者等信息.     在这 ...

  4. input框的默认bug解决办法

    input框的默认bug是在没干掉边框的情况下是不能设置背景颜色的,否则边框会变成内边框(黑色)效果,很难看. 解决办法是: none掉input框的边框:border:none; 再设置其背景色为任 ...

  5. HTML复选框checkbox默认样式修改

    此方法可以将复选框的默认样式替换成任意样式.如图: 未选择: 选择时: 思路:将复选框隐藏,利用lebal元素的焦点传递特性,用lebal的样式替代复选框. 代码如下: <!DOCTYPE ht ...

  6. 【转】html5中如何去掉input type date默认样式

    html5中如何去掉input type date默认样式1.时间选择的种类:HTML代码: 选择日期:<input type="date" value="2017 ...

  7. html5中如何去掉input type date默认样式

    html5中如何去掉input type date默认样式 1.时间选择的种类: HTML代码: 选择日期:<input type="date" value="20 ...

  8. 在vue组件的stylus样式总 取消search类型的input按钮中默认样式

    在vue组件的stylus样式中 取消search类型的input按钮中默认样式 记录一个坑 环境 Vue组件 使用了Stylus的CSS风格. 问题 input输入框使用了 type="s ...

  9. 用纯css改变下拉列表select框的默认样式(不兼容IE10以下)

    在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式.     事情是这样的,您的设计师团队向您发送一个新的PSD(Photoshop文档),它是一个新的网站的最终设计 ...

随机推荐

  1. Vue 事件监听实现导航栏吸顶效果(页面滚动后定位)

    Vue 事件监听实现导航栏吸顶效果(页面滚动后定位) Howie126313 关注 2017.11.19 15:05* 字数 100 阅读 3154评论 0喜欢 0 所说的吸顶效果就是在页面没有滑动之 ...

  2. 下载PDF格式的Html

    下载PDF格式的Html 首先准备需要的两个js jsPdf.debug.js html2canvas.js 直接上代码: function download() { html2canvas(docu ...

  3. 【线性代数】2-5:逆(Inverse)

    title: [线性代数]2-5:逆(Inverse) toc: true categories: Mathematic Linear Algebra date: 2017-09-11 20:00:1 ...

  4. 【CUDA 基础】6.0 流和并发

    title: [CUDA 基础]6.0 流和并发 categories: - CUDA - Freshman tags: - 流 - 事件 - 网格级并行 - 同步机制 - NVVP toc: tru ...

  5. eclipse中不能找到dubbo.xsd

    使用dubbo时遇到问题: org.xml.sax.SAXParseException: schema_reference.4: Failed to read schema document 'htt ...

  6. Zookeeper原理 二

    Zookeeper到底是什么!? 学一个东西,不搞明白他是什么东西,哪还有心情学啊!! 首先,Zookeeper是Apache的一个java项目,属于Hadoop系统,扮演管理员的角色. 然后看到官网 ...

  7. 5.13T1Send 题(send)

    Send 题(send) [题目描述] 某个国家有

  8. DNA Sorting

    DNA Sorting Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 105159   Accepted: 42124 De ...

  9. html5验证自适应

    // 移动端跳转 var OS = function() { var a = navigator.userAgent, b = /(?:Android)/.test(a), d = /(?:Firef ...

  10. 2.2 Go语言基础之位运算操作

    一.位运算符 位运算符对整数在内存中的二进制位进行操作. 运算符 描述 & 参与运算的两数各对应的二进位相与. (两位均为1才为1) | 参与运算的两数各对应的二进位相或. (两位有一个为1就 ...