/*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. hdu Code Lock

    题意是说有N个字母组成的密码锁, 如[wersdfj],   每一位上的字母可以转动, w可转动变成x, z变成a.但是题目规定, 只能同时转动某个区间上的所有字母, 如[1,3], 那么第1到第3个 ...

  2. 关于viewpoint的疑惑

    问题: 为什么在手机上打开一个PC web页面,用手机打开一个宽度为980的固定布局页面,页面会默认缩放到刚好满屏显示,并不会出现横向滚动条? 一:设备像素和CSS像素区别 现代浏览器中实现缩放的方式 ...

  3. 安装repcached,并且测试其双向复制是否成功

    备注:本实验不仅包括了repcached,还包括了memcache的配置安装 1.1实验环境. 1.2环境准备. 1.3配置一个memcache. 1.3.1安装memcache. 1.3.2启动me ...

  4. Learn ZYNC (4)

    最近整理出一些适合学习zed的实例(所有的例程都基于Vivado2013.4开发环境) (1)关于zed双核的测试案例: 官方链接:地址1.11.standalone,地址1.12.linux 修改源 ...

  5. 《JAVA开发环境的熟悉》实验报告——20145337

  6. 【iCore3 双核心板】例程十九:USBD_MSC实验——虚拟U盘

    实验指导书及代码包下载: http://pan.baidu.com/s/1i4eNbQd iCore3 购买链接: https://item.taobao.com/item.htm?id=524229 ...

  7. iOS CAShapeLayer记录

    基本知识 看看官方说明: /* The shape layer draws a cubic Bezier spline in its coordinate space. * * The spline ...

  8. DHCP Set Hostname

    参考: FreeBSD DHCP Set Hostname ( Empty Hostname After Reboot ) -- http://www.cyberciti.biz/faq/freebs ...

  9. ASP.NET 大文件上传

    一 web.config 配置: 1). <system.webServer> <security> <requestFiltering> <!-- maxA ...

  10. 利用vs2013简单初探Python

    最近无聊,某天无意在vs2013上发现了Python...... Python介绍:可以自己搜索一下. 接下来,准备工具: Win7搭建开发环境.需要准备Python.PTVS2013. 1.http ...