h5 编辑单选框的样式
radio单选框样式设置
input[type=radio] {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
-webkit-appearance: none;
background-color: transparent;
border: 0;
outline: 0 !important;
line-height: 20px;
color: #d8d8d8;
}
input[type=radio]:after {
content: "";
display:block;
width: 20px;
height: 20px;
border-radius: 50%;
text-align: center;
line-height: 14px;
font-size: 16px;
color: #fff;
border: 3px solid #ddd;
background-color: #fff;
box-sizing:border-box;
}
input[type=radio]:checked:after {
content: "L";
transform:matrix(-0.766044,-0.642788,-0.642788,0.766044,0,0);
-webkit-transform:matrix(-0.766044,-0.642788,-0.642788,0.766044,0,0);
border-color: #099414;
background-color: #099414;
}
h5 编辑单选框的样式的更多相关文章
- 自定义单选框radio样式
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 替换input单选框的样式
实现效果:. css的input单选框的样式很丑,有时候不想使用原生的样式,如上照片,可以使用下面的方法. 思路是,给inpu加visibility:hidden隐藏,然后使用不同的图片绝对定位覆盖在 ...
- js自定义修改复选框单选框样式,清除复选框单选框默认样式
之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...
- 纯CSS3来自定义单选框radio与复选框checkbox
单选框(radio)自定义样式 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 3 ...
- CSS3-实现单选框radio的小动画
在微信上看到一个教程文,觉得制作的小动画还是很有意思的,自己也试验了一下.一开始动画怎么都不执行(我用的HB),因为内置浏览器对css3的不兼容.加上各种浏览器前缀后就好了.但是旋转那个效果,在HB里 ...
- LODOP打印超文本字符串拼接2 单选选择css样式表格
之前的相关字符串拼接的博文:LODOP打印超文本字符串拼接1 固定表格填充数值之前博文介绍过,字符串可以随意拼接,只要最后组织成的字符串是自己需要的超文本就可以了,前面还有一篇也是拼接样式的:Lodo ...
- 可分组的选择框控件(MVVM下)(Toggle样式 仿造单选框RadioButton,复选框CheckBox功能)
原地址: http://www.cnblogs.com/yk250/p/5660340.html 效果图如下:支持分组的单选框,复选框样式和MVVM下功能的实现.这是项目中一个快捷键功能的扩展. 1, ...
- 点击盒子选中里面的单选框,并给盒子添加相应样式,美化单选框、复选框样式css用法,响应式滴
pc效果图: 移动端效果图: 代码直接上: <!DOCTYPE html> <html> <head> <meta http-equiv="Cont ...
- jQuery --- 实现 checkbox 样式的单选框
早就想写点博客了 一直懒着动 最近发现一些写过的东西都不记得了,下决心把自己平时遇到的问题.得到的经验记录下来,希望能大家一点帮助 这是之前写的一个模态框 要求单选 但是 要求radio的默认样式 ...
随机推荐
- json序列化字符串后,配置枚举类型显示数值而不是名称
2019独角兽企业重金招聘Python工程师标准>>> 经常有这么一个需求,实体类里面用到枚举常量,但序列化成json字符串时.默认并不是我想要的值,而是名称,如下 类 @Data ...
- webpack4.x开发环境配置
写这篇文章的初衷在于,虽然网络上关于webpack的教程不少,但是大多已经过时,由于webpack版本更新后许多操作变化很大,很多教程的经验已经不适合.当我们使用npm安装webpack时,若不指定w ...
- Joomla CMS 3.2-3.4.4 SQL注入 漏洞分析
RickGray · 2015/10/26 11:24 昨日,Joomla CMS发布新版本3.4.5,该版本修复了一个高危的SQL注入漏洞,3.2至3.4.4版本都受到影响.攻击者通过该漏洞可以直接 ...
- Linux 查看进程资源--ps、top命令
1,ps命令 ps能够给出当前系统中进程的快照.它能捕获系统在某一事件的进程状态 命令参数: a 显示所有进 ...
- 四、CentOS 6.5 上传和安装Nginx
CentOS 6.5 上传和安装Nginx
- Codeforces Round 623(Div. 2,based on VK Cup 2019-2020 - Elimination Round,Engine)D. Recommendations
VK news recommendation system daily selects interesting publications of one of n disjoint categories ...
- 将A页面提交的数据id传递到B页面
A页面 在A页面跳转到B页面的时候,在url后面可以拼接参数 例如: window.location.href = './B.html?' + id; 跳转到B页面之后,可以通过url地址获取到从A页 ...
- 线段树 扫描线 L - Atlantis HDU - 1542 M - City Horizon POJ - 3277 N - Paint the Wall HDU - 1543
学习博客推荐——线段树+扫描线(有关扫描线的理解) 我觉得要注意的几点 1 我的模板线段树的叶子节点存的都是 x[L]~x[L+1] 2 如果没有必要这个lazy 标志是可以不下传的 也就省了一个pu ...
- Spring官网阅读(十)Spring中Bean的生命周期(下)
文章目录 生命周期概念补充 实例化 createBean流程分析 doCreateBean流程分析 第一步:factoryBeanInstanceCache什么时候不为空? 第二步:创建对象(crea ...
- NEON的比较是把所有的bit都设置为1
NEON中的比较指令,如果结果为true,是把所有的bit都设置为1,而不是设置为1. ushort data1[4] = {129,0,136,255}; uint16x4_t v0 = vld1_ ...