之前为大家分享了好多css3实现的按钮。今天要为大家分享的是纯css3实现的checkbox复选框和radio单选框,效果超级炫。先让我们看看图吧!

这个实例完全由css3实现的没有任何js代码。下面我们一起看下实现代码吧
html代码:
css3代码:
}</p>
<p>body {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  box-orient: horizontal;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  box-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  box-align: stretch;
  background: #e8ebee;
  color: #9faab7;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
}
body div {
  padding: 5rem;
}
body label {
  display: block;
  line-height: 40px;
}
是不是很简单。只要复制上面的html代码和css代码到页面上。运行就可以看到效果了。赶紧试一试吧。哈哈

