<style type="text/css">
.chk_1 {
width: 20px;
height: 20px;
position: absolute;
top: 15px;
left: 10px;
}
.chk_1 + label {
background: #ccc;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
left: 12px;
}
.chk_1:checked + label {
background:red;
}
</style>
</head> <body>
<input type="checkbox" id="checkbox_a1" class="chk_1">
<label for="checkbox_a1"></label>
</body>

Input checkbox 添加样式背景的更多相关文章

  1. 自定义input[type="checkbox"]的样式

    对复选框自定义样式,我们以前一直用的脚本来实现,不过现在可以使用新的伪类 :checkbox 来实现. 如果直接对复选框设置样式,那么这个伪类并不实用,因为没有多少样式能够对复选框起作用.不过,倒是可 ...

  2. React 项目中修改 Ant Design 的默认样式(Input Checkbox 等等

    修改样式更符合项目的需求特别是在 Input 和 Checkbox 等等一系列 试过很的方式都有问题, 比如直接在行内添加样式会无法传递到特定的层级 最好的办法是添加 id 可行 渲染部分代码 < ...

  3. css input checkbox复选框控件 样式美化的多种方案

    checkbox复选框可能是网站中常用的html元素,但大多数人并不满意它的默认样式,这篇文章就讲讲如何实现input checkbox复选框控件 样式美化效果. 资源网站大全 https://55w ...

  4. 使用<label>标签修改input[type="checkbox"]的样式

    因为<label>的特性有两点 : ①不呈现任何效果, ②用户点击该标签, 浏览器能自动将焦点转移到相关的表单控件上. <form> <input type=" ...

  5. css input checkbox和radio样式美化

    参考:https://segmentfault.com/a/1190000004553258 http://www.haorooms.com/post/css_mh_ck_radio 思路都一样的,先 ...

  6. [转]用CSS给SVG <use>的内容添加样式

    来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=ref ...

  7. input 选择框改变背景小技巧

    最近在项目中遇到一个问题,想要改变input选择框的背景,然而,令我没有想到的是,竟然无法直接改变背景的颜色 通常情况下:我们都可以通过改变元素的 background-color 的值来改变元素的背 ...

  8. 遭遇input与button按钮背景图失效不显示的解决办法

    笔者从事网页前端代码页面工程师已有多年,作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS(正确的说法是XHTML+CSS)在 IE.FireFox火狐. 谷歌浏览器CHROME.苹果浏览器S ...

  9. 使用script创建标签添加属性值和添加样式

    <mark>使用script创建标签和给标签属性值以及样式的方法</mark><script> window.onload=function(){ var btn= ...

随机推荐

  1. 通过Hander进行界面刷新

    Timer timer; TimerTask task; Handler handler;//先声明这3个变量 //在onCreate方法内 handler = new Handler(){ @Ove ...

  2. Unity Project Wizard (最近打开的项目记录)

    最近打开工程列表 当用Unity打开过的项目越来越多之后,在最近打开项目记录框中就会变的很长,那么如何才能删除最近打开的记录呢? Unity4.x最近打开的工程记录 Unity5.x最近打开的工程记录 ...

  3. [转]mvc3 使用session来存储类来存储用户登陆信息

    mvc3 使用session来存储类来存储用户登陆信息 2013-08-26 09:48:56|  分类: NET开发 |举报 |字号 订阅   项目之前的登陆机制是这样的:用户登陆后初始化一个类,类 ...

  4. [No000018]都在背单词,为啥学霸那么厉害-如何在一天内记200个单词?

  5. poj[1185]炮兵阵地

    Description 司令部的将军们打算在N*M的网格地图上部署他们的炮兵部队.一个N*M的地图由N行M列组成,地图的每一格可能是山地(用"H" 表示),也可能是平原(用&quo ...

  6. 为什么mysql设置了密码之后,本地还可以直接访问,不需要输入密码就可以登录数据库了?

    应为数据库里面有空用户 select * from mysql.user where user=''; 查询如果有,把他删了然后重启mysql服务. 他有空用户你删除了 然后重启mysql生效,这个是 ...

  7. phantomjs模拟登录

    最近在做一些公司其他部门系统的后台模拟操作,但由于那边的系统最开始是外包给其他公司开发的,现在那边的开发也不知道有些post的参数是如何生成的.于是想考察下是不是可以把phantomjs这个工具给加进 ...

  8. Easyui Tree方法扩展 - getLevel(获取节点级别)

    Easyui Tree一直就没有提供这个方法,以前没有用到,所以一直没怎么在意,这次自己用到了,顺便扩展了一个方法,分享给大家. $.extend($.fn.tree.methods, { getLe ...

  9. zabbix_proxy安装[yum mysql5.6]

      安装mysql rpm -ivh http://dev.mysql.com/get/mysql-community-release-el6-5.noarch.rpm   修改mysql配置: [m ...

  10. XMLHTTPRequest/Ajax请求 和普通请求的区别

    Ajax请求头会多一个x-requested-with参数,值为XMLHttpRequest 详情:http://blog.csdn.net/zhangdaiscott/article/details ...