自定义checkbox,redio等
直接上代码:
看的懂看,看不懂拉到。
.messageState li {list-style: none;float: left;padding-right:30px;font-size: 16px;color: #1e1e1e;-moz-user-select: none;-ms-user-select: none;-webkit-user-select: none;}
.messageState li input[type="checkbox"] {position: absolute;clip: rect(0, 0, 0, 0);}
.messageState li input[type="checkbox"] + label::before {
content: "\a0";
display: inline-block;
vertical-align: 0px;
width: 16px;
height: 16px;
margin-right: 10px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 2px;
text-indent: 2px;
line-height: 13px;
}
.messageState li input[type="checkbox"]:checked + label::before {
content: "\2713";
color: white;
background-color: #009FE1;
}
.messageState li input[type="checkbox"]:focus + label::before {
box-shadow: 0 0 1px 3px #eee;
}
.messageState li input[type="checkbox"]:disabled + label::before {
box-shadow: none;
background-color: gray;
color: #555;
}
自定义checkbox,redio等的更多相关文章
- 自定义 checkbox 新玩法 ?
自定义 checkbox 新玩法 ? 第一步:selector 编写 drawable/selector_checkbox_voice.xml <?xml version="1.0&q ...
- Yii提供的Htmler助手checkboxList可自定义Checkbox输出格式
foreach($catetags as $cate){ echo Html::checkboxList('category_id','',$cate,['item'=>'customCheck ...
- jquery validate自定义checkbox验证规则和样式
参考:http://blog.csdn.net/xh16319/article/details/9987847 自定义checkbox验证,“检查checkbox是否选中” jQuery.valida ...
- html自定义checkbox、radio、select —— select篇
上一篇<html自定义checkbox.radio.select —— checkbox.radio篇>介绍了我们是怎么将 html 自带的 checkbox.radio 改成我们自定义的 ...
- html自定义checkbox、radio、select —— checkbox、radio篇
前些日子,所在公司项目的UI做了大改,前端全部改用 Bootstrap 框架,Bootstrap的优缺点在此就不详述了,网上一大堆相关资料. 前端的设计就交给我和另一个同事[LV,大学同班同学,毕业后 ...
- 自定义checkbox样式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Android之自定义checkbox样式
大部分情况下,我们在UI中并不采用Android自带的checkbox复选框样式,这时候就需要我们自定义自己的checkbox. 首先找两张checkbox背景图片,比如下图样子的: 然后在drawa ...
- 自定义checkbox, radio样式
17.2.25.nimil 今天开始做百度前端学院的任务,第一个是自定义checkbox, radio样式. checkbox和radio两个标签是不可以改变样式的,background-color. ...
- 自定义checkbox/radio
一. label标签 1. 概念: HTML <label>元素表示用户界面中项目的标题.它通常关联一个控件,或者是将控件放置在label元素内,或者是用作其属性.这样的控制称作label ...
随机推荐
- Python 的 os 与 sys 模块
os与sys模块的官方解释如下: os: This module provides a portable way of using operating system dependent functio ...
- linux终端出现"-bash-2.05b$"现象的解决方法
参考:http://blog.chinaunix.net/uid-22823163-id-3295220.html
- Day4 - J - Rank of Tetris HDU - 1811
自从Lele开发了Rating系统,他的Tetris事业更是如虎添翼,不久他遍把这个游戏推向了全球. 为了更好的符合那些爱好者的喜好,Lele又想了一个新点子:他将制作一个全球Tetris高手排行榜, ...
- Verilog 2001 `default_nettype none
在Verilog 1995規定,對於沒宣告的信號會自動視為wire,這樣常常造成debug的困難,Verilog 2001另外定義了`default_nettype none,將不再自動產生wire. ...
- 060、Java中定义有返回值有参数的方法
01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...
- 009、Java中超过了int的最大值或最小值的结果
01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...
- python中numpy矩阵运算操作大全(非常全)!
python中numpy矩阵运算操作大全(非常全) //2019.07.10晚python矩阵运算大全1.矩阵的输出形式:对于任何一个矩阵,python输出的模板是:import numpy as n ...
- Unity Reflection Probe使用入门
贴官方API的说法: 反射探头: 一个反射探头很像一个相机,捕获了周围所有方向的球形视图.然后将捕获的图像存储为Cubemap,可由具有反射材料的对象使用.在给定场景中可以使用多个反射探测器,可以将对 ...
- 关于http的两种上传方法
http传输数据GET和POST的两种方法: 1.Post传输数据时,不需要在URL中显示出来,而Get方法要在URL中显示. 2.get方式传递的参数可以在URL上看见,安全性不高,反之post安全 ...
- JuJu团队12月1号工作汇报
JuJu团队12月1号工作汇报 JuJu Scrum 团队成员 今日工作 剩余任务 困难 于达 修改generator函数 优化代码 不熟悉julia 婷婷 和金华一起调试main.jl 继 ...