资讯专栏INFORMATION COLUMN

css 模拟 radio样式

godiscoder / 2286人阅读

css:

.check-box {
  margin: 0 10px;
  cursor: pointer;
}
.check-box:before {
  content: "";
  background: #ffffff;
  display: inline-block;
  width: 8px;
  height: 8px;
  border: 2px solid #fff;
  border-radius: 100%;
  cursor: pointer;
  vertical-align: bottom;
}
.check-box.checked:before {
  background: #9ec707;
}

html:

选择操作系统: CentOS Ubuntu / Debian

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/50046.html

相关文章

  • CSS魔法堂:改变单选框颜色就这么吹毛求疵!

    摘要:前言是否曾经被业务提出能改改这个单选框的颜色吧让它和主题颜色搭配一下吧,然后苦于原生不支持换颜色,最后被迫自己手撸一个凑合使用。设置为的样式行为特征单选框的行为特征,明显就是选中与否,及选中状态的改变事件,因此我们必须保持对外提供事件。 前言  是否曾经被业务提出能改改这个单选框的颜色吧!让它和主题颜色搭配一下吧!,然后苦于原生不支持换颜色,最后被迫自己手撸一个凑合使用。若抛开inpu...

    freecode 评论0 收藏0
  • 修改radio、checkbox和select默认样式

    摘要:现在前端页面效果日益丰富,默认的组件样式显然已经不能满足需求。兼容更低版本浏览器的样式修改最后附上演示链接修改和默认样式 现在前端页面效果日益丰富,默认的input组件样式显然已经不能满足需求。趁着这次开发的页面中有这方面的需求,在这里整理一下修改radio、checkbox、select的方法。 radio and checkbox 修改radio的默认样式有两种常用的方法 纯CSS...

    mumumu 评论0 收藏0
  • CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅

    摘要:利用用和来做表单即时校验需求让表单检验变得简单优雅,不需要写冗长的代码来校验设置样式丰富了表单元素,提供了类似等表单元素属性。不知细叶谁裁出,二月春风似剪刀。首先,你需要先了解一下渐变的使用技巧。 之前不久,由于自己平时涉猎还算广泛,总结了一篇博客:这些JavaScript编程黑科技,装逼指南,高逼格代码,让你惊叹不已,没想到受到了大家的欢迎,有人希望能博主还能整理个 CSS 的一些黑...

    Berwin 评论0 收藏0
  • CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅

    摘要:利用用和来做表单即时校验需求让表单检验变得简单优雅,不需要写冗长的代码来校验设置样式丰富了表单元素,提供了类似等表单元素属性。不知细叶谁裁出,二月春风似剪刀。首先,你需要先了解一下渐变的使用技巧。 之前不久,由于自己平时涉猎还算广泛,总结了一篇博客:这些JavaScript编程黑科技,装逼指南,高逼格代码,让你惊叹不已,没想到受到了大家的欢迎,有人希望能博主还能整理个 CSS 的一些黑...

    MASAILA 评论0 收藏0

发表评论

0条评论

godiscoder

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<