<!--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. JGUI源码:Accordion折叠到侧边栏实现(6)

    折叠和非折叠效果如左右图所示 代码如下 //折叠 $.fn.jAccordionfold = function() { return this.each(function() { var obj = ...

  2. python3 udp版简单的聊天器

    单任务的聊天系统. 获取键盘数据,并将其发送给对方 接收数据并显示 并且功能数据进行选择以上的2个功能调用 代码实现 import socket def send_msg(udp_socket): & ...

  3. Hello jna

    记录下这几天用jna3.5.0调c++写的dll的经历 os:win7 用jna调dll首先需要一个dll文件并有可调的方法,然后根据方法的名称,参数,返回值编写一个interface c++需要包含 ...

  4. Spring系列(六) Spring Web MVC 应用构建分析

    DispatcherServlet DispatcherServlet 是Spring MVC的前端控制器名称, 用户的请求到达这里进行集中处理, 在Spring MVC中, 它的作用是为不同请求匹配 ...

  5. scikit-learn 决策树 分类问题

    1.Demo from sklearn import tree import pydotplus import numpy as np #李航p59表数据 #年龄,有工作,有自己房子,信贷情况,类别 ...

  6. php 默认保几位小数,末尾为0去掉

    计算保留几位小数,末位为0舍去 // 计算 默认保留1位小数 protected function getSprintf($value,$count,$digit = 1) { $num = 0; i ...

  7. ModuleNotFoundError: No module named 'video_back.urls'

    新建Django项目时将settings,urls移除来时报错. 这是我所想要的项目结构  >>>  扁平结构. 将下面这个应用的名字删掉就可以了.

  8. resultset 查询时返回多个相同值

    背景 做个简单的接口开发,拿到的平台比较不理想,好久没重新搭建一个了,正好练练手.用了基础的servlet,maven,logback(log4j不支持格式化,比较烦人),fastjson,druid ...

  9. sklearn.linear_model.LinearRegresion学习

    sklearn线性模型之线性回归 查看官网 https://scikit-learn.org/stable/modules/generated/sklearn.linear_model.LinearR ...

  10. 对Java框架spring、hibernate、Struts的粗浅理解

    对 Struts 的理解:1. struts 是一个按 MVC 模式设计的 Web 层框架,其实它就是一个大大的 servlet,这个Servlet 名为 ActionServlet,或是 Actio ...