checkbox 用css改变默认的样式
<!--html-->
<label class="bl_input_checkbox click_checkbox" che_data="10"><input type="checkbox" name="" value=""><i></i><span>有作品</span></label>
//css
.bl_input_checkbox i {font-size:12px;font-style:normal;display:inline-block;width:13px;height:13px;text-align:center;line-height:13px;color:#fff;vertical-align:middle;margin:-2px 5px 1px 0px;border:#FF6600 1px solid;
background-size: auto;
background-repeat: no-repeat;
background-position: center -3px;
}
.bl_input_checkbox input[type="checkbox"]{display:none;}
.bl_input_checkbox input[type="checkbox"]:checked + i{/*background:#FF6600;*/ background-image: url('../img/duihao_2.png');}
图片解说:


checkbox 用css改变默认的样式的更多相关文章
- 用纯css改变默认的radio和checkbox的样式
利用css的label的伪类(::before)代替checkbox和radio效果: 优点:需要图片来调整选中前和选中后的样式,纯css搞定 缺点:兼容性,IE8以下不支持 在线例子: css改变默 ...
- 详解CSS设置默认字体样式
浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...
- 用css改变默认的checkbox样式
自己常用的改变checkbox样式的两个方法: 一.利用background用图片代替checkbox效果 缺点:你首先得有一张好看的图片 优点:浏览器兼容性好 <!doctype html&g ...
- css控制默认滚动条样式
针对webkit内核的浏览器,使用伪类来改变滚动条的默认样式,详情如下: 滚动条组成部分 1. ::-webkit-scrollbar 滚动条整体部分 2. ::-webkit-scrollbar-t ...
- FineReport——JS二次开发(CSS改变控件样式)
FR提供一些选择器,可以改变部分控件的样式,那么对于如何书写自己的css: 可以自己写css文件导入,也可以在页面加载结束事件中添加JS方法来改变css样式. 以文本框为例: 书写css文件,保存至% ...
- css 修改默认滚动条样式
来自:https://www.cnblogs.com/juqian/p/6273808.html 侵删 <div class="inner"> <div clas ...
- CSS——改变浏览器滚动条样式
https://www.cnblogs.com/sun-rain/p/5789417.html
- 用纯css改变下拉列表select框的默认样式(不兼容IE10以下)
在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 事情是这样的,您的设计师团队向您发送一个新的PSD(Photoshop文档),它是一个新的网站的最终设计 ...
- 用纯css改变下拉列表select框的默认样式
http://ourjs.com/detail/551b9b0529c8d81960000007 在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 问题的提出 事 ...
随机推荐
- MyEclipse 2015 Stable 2.0破解方法
本篇博文简单介绍一下利用网上说明的方法破解MyEclipse 2015 Stable 2.0的具体细节.因为原来在贴吧上的方法不够详细,所以本人重新整理了一下.方法源自:http://tieba.ba ...
- 学习WPF
http://www.cnblogs.com/prism/archive/2010/07/21/1781855.html 如何在WPF中画三角,以及把按钮设置成颜色渐变的样式:
- 2.9 while循环
while循环 <1>while循环的格式 while 条件: 条件满足时,做的事情1 条件满足时,做的事情2 条件满足时,做的事情3 ...(省略)... demo i = 0 whil ...
- ionic 扫描二维码 Barcode Scanner、QR Scanner、ZBar
1.简介 ionic 官方给我们提供了三个扫描二维码条形码插件,分别为: Barcode Scanner 样式好看,类似支付宝的扫描框.速度稍微比最后一个慢几百毫秒,主要问题是 Android 部分手 ...
- 基于深度学习的目标检测技术演进:R-CNN、Fast R-CNN、Faster R-CNN
object detection我的理解,就是在给定的图片中精确找到物体所在位置,并标注出物体的类别.object detection要解决的问题就是物体在哪里,是什么这整个流程的问题.然而,这个问题 ...
- Django部署方法
Windows方案: Apache2.4 + Django2.0 网上的方法乱七八糟: 那么接下来:最好的方法,不行吃屎. 当前环境是Django2.0+ python35(64bit) 部署原因: ...
- Django ORM中,如何使用Count来关联对象的子集数量
示例models 解决方法 有时候,我们想要获取一个对象关联关系的数量,但是我们不要所有的关联对象,我们只想要符合规则的那些关联对象的数量. 示例models # models.py from dja ...
- 【原创】大数据基础之Kudu(2)移除dead tsever
当kudu有tserver下线或者迁移或者修改hostname之后,旧的tserver会一直以dead状态出现,并且tserver日志中会有大量的连接重试日志,一天的错误日志会有几个G, W0322 ...
- Python 爬虫 某迅漫画 selemiun+plantomJS
目标站点需求分析 爬取某迅漫画到本地 涉及的库 selenium, PhantomJS time,urllib.request,os,random 模拟滑动窗口,获取完整网页 保存到文件中 获取本地h ...
- js-检测字符串出现次数最多,并返回
function validateStr(val){ let obj = {}; let maxNum = -1; let maxStr; for(let i=0;i<val.length;i+ ...