/*check,radio*/
input.check_txt[type='checkbox']{
display: none;
} input.check_txt[type='checkbox'] + label{
display: block;
float: left;
-moz-appearance: none;
-webkit-appearance: none;
width: 20px;
height: 20px;
background: #fff;
border:2px solid #cecece;
border-radius: 3px; cursor:pointer;
} input.check_txt[type='checkbox']:checked + label {
background: #f0f0f0 url(../images/check.png) no-repeat center center;
background-size:80%; }

html:

<p class="xd-clause-wrap">
<input type="checkbox" name="" id="clause" value="">
<label for="clause"></label>&nbsp;&nbsp;我已阅读并同意<a href="javascript:;">《借款服务条款》</a>
</p>

css美化checkbox radio样式的更多相关文章

  1. css美化checkbox的样式

    使用iCheck插件可以改变checkbox.radio的原有样式,但是改变的样式尺寸有些大修改起来也比较麻烦,并且需要使用iCheck的调用方法才能使用,有时候iCheck方法还会覆盖掉同级元素的c ...

  2. 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

    参考文章: 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

  3. 用CSS美化checkbox复选按钮和raido单选按钮-适用于移动端

    最终效果: 实现方法 index.html: <!DOCTYPE html> <html> <head> <title></title> & ...

  4. 利用纯CSS美化checkbox和radio和滑动按钮的实现

    W3C提供的CheckBox和radio的原始样式非常的丑,而且在不同的额浏览器表现还不一样,使用常规的方法添加样式没法进行修改样式 一, 单选按钮 <html> <head> ...

  5. css修改原生radio样式

    日常工作中经常会用到单选框radio,而原生样式不好看无法满足项目要求,模拟写一个又比较麻烦,所以写了一个改变原生样式的demo. 原生样式: 改变后的样式: 以下为demo代码: <!DOCT ...

  6. CSS之checkbox&radio&textarea&select

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. checkbox/radio 样式修改

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

  8. css 绘制checkbox,radio

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  9. 自定义checkbox,radio样式

    input[type=radio] { margin-right: 5px; cursor: pointer; font-size: 14px; width: 15px; height: 15px; ...

随机推荐

  1. 创建删除元素appendChild,removeChild,createElement,insertBefore

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  2. Lambda表达式公共拼接函数(原创)

    #region Lambda公共拼接函数 /// <summary> /// LambdaWhere(枚举) /// </summary> public enum Lambda ...

  3. # 20145334赵文豪 《Java程序设计》第5周学习总结

    20145334赵文豪 <Java程序设计>第5周学习总结 教材学习内容总结 第八章 1.使用try.catch打包System.in.read(),声明throws java.io.IO ...

  4. NLP用CNN分类Mnist,提取出来的特征训练SVM及Keras的使用(demo)

    用CNN分类Mnist http://www.bubuko.com/infodetail-777299.html /DeepLearning Tutorials/keras_usage 提取出来的特征 ...

  5. ping & tracert over TCP

    偶然发现还有这样的工具: 通过TCP协议实现ping和tracert. 之前一直苦恼无法通过ping的方式测试被q网站, 现在有了这两个工具后就方便了. [Windows] tcping: http: ...

  6. an alternative to symmetric multiprocessing

    COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION 17.5 CLUSTERSAn impor ...

  7. [转]jni数据类型映射、域描述符说明

    在Java存在两种数据类型: 基本类型 和 引用类型 ,大家都懂的 . 在JNI的世界里也存在类似的数据类型,与Java比较起来,其范围更具严格性,如下: 1.primitive types ---- ...

  8. MongoShell中的一些命令总结

    mongo 127.0.0.1 可以连接到本地的mongo数据库并进入shell exit可以退出shell show dbs 可以查看当前数据库中所有的数据库名称 use [数据库名称] 可以进入指 ...

  9. 纯CSS实现tooltip提示框,CSS箭头及形状

    本片介绍仅用CSS做出tooltip那样的提示框及箭头等形状! 首先介绍一下CSS:after选择器 定义和用法:(参考w3school:after选择器) :after选择器在被选元素的内容后面插入 ...

  10. schtasks在win7下提示错误:无法加载列资源

    转自: http://blog.chinaunix.net/uid-24946452-id-2887851.html 查看cmd 编码 chcp 如使用 936中文GBK编码的话 schtasks.e ...