二十六、css3改变checkbox复选框的样式
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<style>
span {
position: relative;
}
.input_check {
position: absolute;
visibility: hidden;
}
.input_check+label {
display: inline-block;
width: 16px;
height: 16px;
border: 1px solid #c00;
}
.input_check:checked+label:after {
content: "";
position: absolute;
left: 2px;
bottom: 12px;
width: 9px;
height: 4px;
border: 2px solid #e92333;
border-top-color: transparent;
border-right-color: transparent;
-ms-transform: rotate(-60deg);
-moz-transform: rotate(-60deg);
-webkit-transform: rotate(-60deg);
transform: rotate(-45deg);
}
</style>
</head> <body>
<span><input type="checkbox" class="input_check" id="check3"><label for="check3"></label></span>
</body> </html>
二十六、css3改变checkbox复选框的样式的更多相关文章
- CSS3自定义checkbox复选框
在线演示 本地下载
- 【转】纯CSS设置Checkbox复选框控件的样式
Checkbox复选框是一个可能每一个网站都在使用的HTML元素,但大多数人并不给它们设置样式,所以在绝大多数网站它们看起来是一样的.为什么不把你的网站中的Checkbox设置一个与众不同的样式,甚至 ...
- 转 纯CSS设置Checkbox复选框控件的样式
Checkbox复选框是一个可能每一个网站都在使用的HTML元素,但大多数人并不给它们设置样式,所以在绝大多数网站它们看起来是一样的.为什么不把你的网站中的Checkbox设置一个与众不同的样式,甚至 ...
- 纯CSS设置Checkbox复选框控件的样式
Checkbox复选框是一个可能每一个网站都在使用的HTML元素,但大多数人并不给它们设置样式,所以在绝大多数网站它们看起来是一样的.为什么不把你的网站中的Checkbox设置一个与众不同的样式,甚至 ...
- 纯css3简单实用的checkbox复选框和radio单选框
昨天为大家分享了一款很炫的checkbox复选框和radio单选框,今天再给大家带来一款简单实用的checkbox复选框和radio单选框.界面清淅.舒服.先给大家来张效果图: 在线预览 源码下载 ...
- 纯css3实现的超炫checkbox复选框和radio单选框
之前为大家分享了好多css3实现的按钮.今天要为大家分享的是纯css3实现的checkbox复选框和radio单选框,效果超级炫.先让我们看看图吧! 在线预览 源码下载 这个实例完全由css3实现 ...
- checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中
checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...
- checkbox复选框样式
随着现代浏览器的流行,纯CSS设置checkbox也变的很是实用,下面会讲到5种与众不同的checkbox复选框. 首先,需要添加一段CSS隐藏所有的Checkbox复选框,下面我们会改变它的外观.要 ...
- 03 CheckBox 复选框
五 CheckBox 复选框 >概念:可以从一个集合选项中选择一个或者多个选项 >属性:checked 选择状态 >使用: > ...
随机推荐
- 用meterpreter实现跳板机
meterpreter跳板机 背景:渗透测试者A拿到了B主机的控制权,但没有拿到ssh密码(不能打ssh隧道).现需横向移动渗透内网主机C,为了避免动作过大不便直接在B上对C进行渗透,其中C不能出 ...
- Asp.NetCore程序发布到CentOs(含安装部署netcore)--最佳实践(二)
Asp.NetCore程序发布到CentOs(含安装部署netcore)--最佳实践(一) 接上一篇 3. Nginx配置反向代理 3.1 cnetos 安装nginx 首先,我们需要在服务器上安装N ...
- vb.net MakeWParam
Private Function MakeWParam(loWord As Integer, hiWord As Integer) As Integer ) End Function
- netfilter及iptables基本概念
网络访问控制 网络访问控制可以简单理解为防火墙,常用的网络访问控制有:哪些IP可以访问服务器, 可以使用哪些协议,哪些接口,是否需要对数据包进行修改等. netfilter netfilter是通过i ...
- Java设计模式之【工厂模式】(简单工厂模式,工厂方法模式,抽象工厂模式)
Java设计模式之[工厂模式](简单工厂模式,工厂方法模式,抽象工厂模式) 工厂模式出现的原因 在java中,创建一个对象最简单的方法就是使用new关键字.但在一些复杂的业务逻辑中,创建一个对象不只需 ...
- 博弈论进阶之Anti-SG游戏与SJ定理
前言 在上一节中,我们初步了解了一下SG函数与SG定理. 今天我们来分析一下SG游戏的变式--Anti-SG游戏以及它所对应的SG定理 首先从最基本的Anti-Nim游戏开始 Anti-Nim游戏是这 ...
- ArcGIS 网络分析[1] 利用自定义点线数据(shp或数据库)创建网络数据集【小白向】
前言 似乎除了官方介绍的例子,我还没有在网上见过一篇介绍如何“使用自己的数据”创建“网络数据集”的文章. 究其原因,是因为当前的高质量的线数据或保密,或采集困难. 有介绍几何网络的,有介绍如何用官方S ...
- 林业有害生物监测系统(重庆宇创GIS)
本文由重庆宇创GIS团队原创,转载请注明来源http://www.cnblogs.com/ycdigit/p/8916073.html 一.概述 林业有害生物监测信息平台(森林病虫害监测预警系统) ...
- iOS-----------关于UDID
最近看友盟的SDK更新日志:(设备系统的正常升级不会改变OpenUDID) Apple公司于2013年5月1日开始,拒绝采集UDID的App上架App Store. 为适应Apple公司的这一政策,2 ...
- TextView走马灯
设置textView走马灯形式显示: android:marqueeRepeatLimit="marquee_forever" android:scrollHorizontally ...