自定义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 ...
随机推荐
- String类与StringBuffer类
String类与StringBuffer类 一.String类和StringBuffer类的区别 String类是不可变类,新建的对象为不可变对象(String类的内容和长度是固定的),一旦被创建 ...
- python笔记12
day12 今日内容 函数中高级(闭包/高阶函数) 内置函数 内置模块(.py文件) 内容回顾 函数基础概念 函数基本结构 def func(arg): return arg; v1 = func(1 ...
- Python入门知识总结【新手必学】
Python 基础学习输入和输出list 和 tuple条件判断循环dict 和 set感觉python这门语言用途较广,先熟悉下其语法.PS:另外很多人在学习Python的过程中,往往因为没有好的教 ...
- mysql里的序列应用详解
相关知识库: MySQL知识库 相关文章: ibatis中主键的返回 oracle 实现自增auto_increament 用oracle的trigger生成主键的时候和hibernate冲突的讨论 ...
- 机器学习算法中的网格搜索GridSearch实现(以k-近邻算法参数寻最优为例)
机器学习算法参数的网格搜索实现: //2019.08.031.scikitlearn库中调用网格搜索的方法为:Grid search,它的搜索方式比较统一简单,其对于算法批判的标准比较复杂,是一种复合 ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮:自适应大小的按钮组
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 解决Google浏览器不能打开kubernetes dashboard方法【转】
在这片文章中,我将展示如何在Google Chrome上打开kubernetes dashboard.本文不叙述如何安装搭建docker和kubernetes,有关详情请上网查阅! 很多小伙伴们在自己 ...
- uni app中关于图片的分包加载
因为在项目中使用了大量的静态资源图片,使得主包体积过大, 而把这些图片全部放到服务器又有点麻烦,就想能不能把图片也分包,但是直接放在分包下的话导致图片资源找不到了, 在社区中看到大佬分享的十分有用,特 ...
- 019.CI4框架CodeIgniter辅助函数类之:Array数组查询
01. 数组辅助函数,可以方便的查看数组内部的成员,用法如下图所示: <?php namespace App\Controllers; class Hello extends BaseContr ...
- Microsoft Windows 实用程序 Sysinternals Utilities Index
最新页面时间:2017年5月16日 Sysinternals被MS收购--windows internals共近70多个工具集 Sysinternals套件 整套Sysinternals Utilit ...