<!--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改变默认的样式的更多相关文章

  1. 用纯css改变默认的radio和checkbox的样式

    利用css的label的伪类(::before)代替checkbox和radio效果: 优点:需要图片来调整选中前和选中后的样式,纯css搞定 缺点:兼容性,IE8以下不支持 在线例子: css改变默 ...

  2. 详解CSS设置默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

  3. 用css改变默认的checkbox样式

    自己常用的改变checkbox样式的两个方法: 一.利用background用图片代替checkbox效果 缺点:你首先得有一张好看的图片 优点:浏览器兼容性好 <!doctype html&g ...

  4. css控制默认滚动条样式

    针对webkit内核的浏览器,使用伪类来改变滚动条的默认样式,详情如下: 滚动条组成部分 1. ::-webkit-scrollbar 滚动条整体部分 2. ::-webkit-scrollbar-t ...

  5. FineReport——JS二次开发(CSS改变控件样式)

    FR提供一些选择器,可以改变部分控件的样式,那么对于如何书写自己的css: 可以自己写css文件导入,也可以在页面加载结束事件中添加JS方法来改变css样式. 以文本框为例: 书写css文件,保存至% ...

  6. css 修改默认滚动条样式

    来自:https://www.cnblogs.com/juqian/p/6273808.html 侵删 <div class="inner"> <div clas ...

  7. CSS——改变浏览器滚动条样式

    https://www.cnblogs.com/sun-rain/p/5789417.html

  8. 用纯css改变下拉列表select框的默认样式(不兼容IE10以下)

    在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式.     事情是这样的,您的设计师团队向您发送一个新的PSD(Photoshop文档),它是一个新的网站的最终设计 ...

  9. 用纯css改变下拉列表select框的默认样式

    http://ourjs.com/detail/551b9b0529c8d81960000007 在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 问题的提出 事 ...

随机推荐

  1. Gram 矩阵与向量到子空间的距离

    设 $W$ 是 $n$ 维 Euclidean 空间 $V$ 的子空间, $\beta\in V$, 定义 $\beta$ 到 $W$ 的距离  $$\bex  \rd (\beta,W)=|\bet ...

  2. 玩转ubuntu之初体验

    安装的是ubuntu16.04.1,分区和具体细节就不多说了,非常简单 安装完之后要做的几件事: 1.设置root密码 #设置root密码 sudo passwd root 2.检查并更新系统 #ub ...

  3. SQL Server安全

    第一篇 SQL Server安全概述 第二篇 SQL Server安全验证 第三篇 SQL Server安全主体和安全对象 第四篇 SQL Server安全权限 第五篇 SQL Server安全架构和 ...

  4. rest_framework框架的认识

    它是基于Django的,帮助我们快速开发符合RESTful规范的接口框架. 一  路由 可以通过路由as_view()传参 根据请求方式的不同执行对应不同的方法 在routers模块下 封装了很多关于 ...

  5. POJ 2398 Toy Storage(叉积+二分)

    Description Mom and dad have a problem: their child, Reza, never puts his toys away when he is finis ...

  6. xheditor编辑器上传图片

    之前在用csdn的时候,觉得他们家的编辑器挺好用,精美,简洁,大方,功能强大.最近自己的项目也要用到编辑器,我就想起了xheditor. 好多大网站都用到它~好棒! 我把xheditor用于文章模块, ...

  7. @Transactional 无效原因

    在controller 上面使用  @Transactional 注解时候发现数据没有回滚,在执行完update 更新语句,事务直接就commit 了, 此时方法尚未执行结束,数据库数据已经更新了. ...

  8. Java_日期时间相关类

    目录 Date类(java.util.date) Calendar类(java.util.Calendar) SimpleDateFormat类(java.text.SimpleDateFormat) ...

  9. Java桥接模式

    定义:将抽象部分与它的具体实现部分分离,使他们都可以独立的变化 通过组合的方式建立两个类之间联系,而不是继承 类型:结构型 适用场景: 抽象和具体实现之间增加更多的灵活性 一个类存在两个(或多个)独立 ...

  10. 原子动作检测 A Better Baseline for AVA

    本文将Faster-RCNN用在了I3D的feature map上,用于视频中多人多动作的检测 challege比赛第二名的整体方法是将Faster-RCNN作用在I3Dfeature上.训练时,以标 ...