css美化checkbox radio样式
/*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> 我已阅读并同意<a href="javascript:;">《借款服务条款》</a>
</p>
css美化checkbox radio样式的更多相关文章
- css美化checkbox的样式
使用iCheck插件可以改变checkbox.radio的原有样式,但是改变的样式尺寸有些大修改起来也比较麻烦,并且需要使用iCheck的调用方法才能使用,有时候iCheck方法还会覆盖掉同级元素的c ...
- 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义
参考文章: 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义
- 用CSS美化checkbox复选按钮和raido单选按钮-适用于移动端
最终效果: 实现方法 index.html: <!DOCTYPE html> <html> <head> <title></title> & ...
- 利用纯CSS美化checkbox和radio和滑动按钮的实现
W3C提供的CheckBox和radio的原始样式非常的丑,而且在不同的额浏览器表现还不一样,使用常规的方法添加样式没法进行修改样式 一, 单选按钮 <html> <head> ...
- css修改原生radio样式
日常工作中经常会用到单选框radio,而原生样式不好看无法满足项目要求,模拟写一个又比较麻烦,所以写了一个改变原生样式的demo. 原生样式: 改变后的样式: 以下为demo代码: <!DOCT ...
- CSS之checkbox&radio&textarea&select
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- checkbox/radio 样式修改
只改颜色 input[type=radio],input[type=checkbox] { display: inline-block; vertical-align: middle; width: ...
- css 绘制checkbox,radio
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- 自定义checkbox,radio样式
input[type=radio] { margin-right: 5px; cursor: pointer; font-size: 14px; width: 15px; height: 15px; ...
随机推荐
- ArcGIS AddIN 之 DockPanel 界面空白
辛辛苦苦写了个AddIn插件,自己用一切正常,发给别人就弹不出DockPanel, 或者弹出时只有Panel,没有具体的控件.经多次排查,原因是: 使用了第三方的界面控件DotNetBar,开发环境中 ...
- 自动解析URL
function parseURL(url) { var a = document.createElement('a'); a.href = url; return { source: url, pr ...
- VS 调试
Vs 单步调试 在vs中的单步调试: 调试重要的几个键: F9在当前光标所在的行下断点,如果当前行已经有断点,则取消断点. F5调试状态运行程序,程序执行到有断点的地方会停下来. F10单步执行程序. ...
- Java简单类(部门、领导、雇员关系)
class Dept { private int deptno ; private String dname ; private String loc ; private Emp emps [] ; ...
- DevExpress GridView对表格的部分说明
1. int[] selects = this.m_grdView1.GetSelectedRows(); // 获取选中的行,可能是几行 2. this.m_grdView1.GetRowCellV ...
- QMessageBox
#include "dialog.h" #include "ui_dialog.h" #include<QMessageBox> Dialog::D ...
- syslog日志系统
目前,linux依旧使用syslogd作为日志监控进程,而在主流的linux发行版中依旧使用sysklog这个比较老的日志服务器套件.从前一篇日志可以看到,对其进行必要的配置能减少很多麻烦,并且可更有 ...
- CSS之cssText
更改元素样式 <div style="width:100px;height:100px;text-align:center;line-height:100px;"> T ...
- 如何使用Sitemap和menu创建网站导航
1.添加Sitemap文件 将Sitemap内容替换为如下示例代码: <?xml version="1.0" encoding="utf-8" ?> ...
- Java提高篇——Java实现多重继承
多重继承指的是一个类可以同时从多于一个的父类那里继承行为和特征,然而我们知道Java为了保证数据安全,它只允许单继承.有些时候我们会认为如果系统中需要使用多重继承往往都是糟糕的设计,这个时候我们往往需 ...