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 编辑单选框的样式的更多相关文章

  1. 自定义单选框radio样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 替换input单选框的样式

    实现效果:. css的input单选框的样式很丑,有时候不想使用原生的样式,如上照片,可以使用下面的方法. 思路是,给inpu加visibility:hidden隐藏,然后使用不同的图片绝对定位覆盖在 ...

  3. js自定义修改复选框单选框样式,清除复选框单选框默认样式

    之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...

  4. 纯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 ...

  5. CSS3-实现单选框radio的小动画

    在微信上看到一个教程文,觉得制作的小动画还是很有意思的,自己也试验了一下.一开始动画怎么都不执行(我用的HB),因为内置浏览器对css3的不兼容.加上各种浏览器前缀后就好了.但是旋转那个效果,在HB里 ...

  6. LODOP打印超文本字符串拼接2 单选选择css样式表格

    之前的相关字符串拼接的博文:LODOP打印超文本字符串拼接1 固定表格填充数值之前博文介绍过,字符串可以随意拼接,只要最后组织成的字符串是自己需要的超文本就可以了,前面还有一篇也是拼接样式的:Lodo ...

  7. 可分组的选择框控件(MVVM下)(Toggle样式 仿造单选框RadioButton,复选框CheckBox功能)

    原地址: http://www.cnblogs.com/yk250/p/5660340.html 效果图如下:支持分组的单选框,复选框样式和MVVM下功能的实现.这是项目中一个快捷键功能的扩展. 1, ...

  8. 点击盒子选中里面的单选框,并给盒子添加相应样式,美化单选框、复选框样式css用法,响应式滴

    pc效果图: 移动端效果图: 代码直接上: <!DOCTYPE html> <html> <head> <meta http-equiv="Cont ...

  9. jQuery --- 实现 checkbox 样式的单选框

    早就想写点博客了 一直懒着动  最近发现一些写过的东西都不记得了,下决心把自己平时遇到的问题.得到的经验记录下来,希望能大家一点帮助 这是之前写的一个模态框 要求单选 但是 要求radio的默认样式 ...

随机推荐

  1. 最简单,最明了,看了就会的VScode和C++的配置!(Visual Studio Code)

    我看了网上的大佬们配的我是在是看不懂啊?我是一个小白啊?这太难了,这阻挡不了我,想使用这很骚的IDE,于是在不断的摸索下,终于配置成功,小白们也不用慌,这次非常简单.一定可以的. 1.下载 VS Co ...

  2. zwx_helper

    通过重载c++operator,实现一种轻松的wxWidgets界面编程风格,如html编写页面一样直观容易. 举一例,一个界面页有四块区,如果是开发html的话,是从头到脚一气书写 <div ...

  3. 【K8S】K8S 1.18.2安装dashboard(基于kubernetes-dashboard 2.0.0版本)

    [K8S]K8S 1.18.2安装dashboard(基于kubernetes-dashboard 2.0.0版本) 写在前面 K8S集群部署成功了,如何对集群进行可视化管理呢?别着急,接下来,我们一 ...

  4. CentOS7 安装boost

    (1)到这个网址www.boost.org下载相应的代码包,我下载的是目前最新的版本boost_1_59_0.tar.bz2 (2)进入目录执行解压操作:tar -jxvf boost_1_59_0. ...

  5. 多线程高并发编程(7) -- Future源码分析

    一.概念 A Future计算的结果. 提供方法来检查计算是否完成,等待其完成,并检索计算结果. 结果只能在计算完成后使用方法get进行检索,如有必要,阻塞,直到准备就绪. 取消由cancel方法执行 ...

  6. Constant Palindrome Sum(贪心*RMQ)

    传送门 怎么说呢,想了几个小时没做出来实在可惜. \(\color{Red}{首先肯定想到暴力嘛!但是x定值有那么多值可以取,怎么办呢?}\) 但是题目中有一个很关键的条件 \[a[i]>=1\ ...

  7. HDU1214圆桌会议

    一个环,从1编号到n. 每次可以交换相邻的两个人, 问最少交换几次,使得每个数字的左右数字交换. 转载自:https://blog.csdn.net/yin_zongming/article/deta ...

  8. E. Marbles 状压dp

    E. Marbles 这个是一个状压dp 题目大意是:给你一个数组,数组的数在1到20之间,有一个操作就是交换相邻的两个数,问 让所有相同的数相邻的最小操作次数 dp[s] 表示s状态下的操作次数,w ...

  9. 初识Java和JDK下载安装

    故事:Java帝国的诞生 对手: C&C++ ◆1972年C诞生 ◆贴近硬件,运行极快,效率极高. ◆操作系统,编译器,数据库,网络系统等 ◆指针和内存管理 ◆1982年C++诞生 ◆面向对象 ...

  10. js函数传递参数的方式------传值与传递指针

    原则: 1. 基本类型:传值 2. 对象:传递指针 应用场景之一: 用jq选择器获取某个div后(例如:element),准备进行某些修改,之后添加到页面中去. 采取例一的方式,append后发现修改 ...