.radio{
position: relative;
border: 1px solid #999;
border-radius: 50%;
width: 12px;
height: 12px;
background-color: #eee;
} .radio.active:after {
content: "";
display: table;
position: absolute;
top: 2px;
left: 2px;
width:6px;
height: 6px;
border-radius: 50%;
background-color: #666;
}

radio样式的更多相关文章

  1. input美化 checkbox和radio样式

    input美化    checkbox和radio样式 看惯了input[checkbox]和input[radio]默认样式,有没有想要改变一下呢?比如下面的样式: 比起html默认的样式,上图这些 ...

  2. 自定义checkbox, radio样式

    17.2.25.nimil 今天开始做百度前端学院的任务,第一个是自定义checkbox, radio样式. checkbox和radio两个标签是不可以改变样式的,background-color. ...

  3. 【前端】input radio多选事件获取所有选中的id,radio样式优化可修改

    $("#all_button").on('click', function() { obj = document.getElementsByClassName("inpu ...

  4. Css实现checkbox及radio样式自定义

    前言 checkbox和radio样式自定义在网页中是很常见的, 比如在进行表单输入时性别的选择,用户注册时选择已阅读用户协议.随着用户对产品体验要求越来越高,我们都会对checkbox和radio重 ...

  5. 表单:checkbox、radio样式(用图片换掉默认样式)

    checkbox.radio样式(用图片换掉默认样式) <!doctype html> <html> <head> <meta charset="u ...

  6. 自定义单选框radio样式

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

  7. 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

    参考文章: 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

  8. 自定义checkbox, radio样式总结

    任务目的 深入了解html label标签 了解CSS边框.背景.伪元素.伪类(注意和伪元素区分)等属性的设置 了解CSS中常见的雪碧图,并能自己制作使用雪碧图 任务描述 参考 样例(点击查看),实现 ...

  9. css设置移动端checkbox和radio样式

    复选框Checkbox是Web应用常用控件,随处可见,原生的复选框控件一般就像下面这样: 这取决于操作系统和浏览器,有些时候,这种样子并不能满足设计要求,这时需要更为精致的复选框样式.以往只有少数浏览 ...

  10. css修改原生radio样式

    日常工作中经常会用到单选框radio,而原生样式不好看无法满足项目要求,模拟写一个又比较麻烦,所以写了一个改变原生样式的demo. 原生样式: 改变后的样式: 以下为demo代码: <!DOCT ...

随机推荐

  1. dp例题01. 任务价值最大化

    题目Description: 大凯有n项任务可选择去做, 分别对应有开始时间, 结束时间以及任务报酬, 同一时间内最多做一件任务, 现在大凯想知道最多能得到多少报酬, 于是把求解任务交给了你. 输入: ...

  2. CoderForces 327D Block Tower

    Portal:http://codeforces.com/problemset/problem/327/D 一座红塔200人,一座蓝塔100人,只有与蓝塔相邻才可以建红塔. '.'处可建塔 '#'处不 ...

  3. C、Guard the empire(贪心)

    链接:https://ac.nowcoder.com/acm/contest/3570/C 来源:牛客网 题目描述 Hbb is a general and respected by the enti ...

  4. STM32F103ZET6串口通信

    1.电平标准 根据通讯使用的电平标准不同,串口通讯可分为TTL标准和RS-232标准,如下表: 从图中可以看到,TTL电平标准使用5V表示高电平,使用0V表示低电平.在R232电平标准中,为了增加串口 ...

  5. Flink| 实时需要分析

    ========================实时流量统计 1. 实时热门商品HotItems 每隔 5 分钟输出最近一小时内点击量最多的前 N 个商品. 抽取出业务时间戳,告诉 Flink 框架基 ...

  6. (C++ Error: Incompatible types in assignment of ‘char*’ to ‘char [2])

    in C++, cannot assign a pointer to an array. c++中char*与char[]不是一种类型,但是在C里面可以,所以尽量使用C++中的类,如string, v ...

  7. 为什么要用内插字符串代替string.format

    知道为什么要用内插字符串,只有踩过坑的人才能明白,如果你曾今使用string.format超5个以上占位符,那其中的痛苦我想你肯定是能够共鸣的. 一:痛苦经历 先上一段曾今写过的一段代码,大家来体会一 ...

  8. Java进行二元操作类型转换

    当对两个数值进行二元操作时,先要将两个操作数转换为同一种类型,然后再进行计算. 如果两个操作数中有一个是double类型,另一个操作数就会转换为double类型. 否则,如果其中一个操作数是float ...

  9. Git mergetool 插件

    首先你喜欢使用git命令行操作,可以上网下载Kdiff3安装到你的电脑,然后按下面的操作就可以使用这个工具了. 1. 安装Kdiff3 软件.(最好使用默认路径) 2. 添加kdiff3到git me ...

  10. MySQL学习之路3-MySQL中常用数据类型

    MySQL中常用数据类型 字符型 存储字符型数据.例如姓名,地址,电话号码等.使用引号括起来,一般使用单引号. 常用类型: char(255) 定长字符串,最大长度255个字符. varchar(25 ...