css伪元素过滤
2015-06-02 17:48
567 查看
input[type="checkbox"], input[type="radio"] {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}
input[type="radio"] {
display: none;
}
input[type="radio"][id="men"]:checked + label {
background: #6666ff;
}
input[type="radio"][id="women"]:checked + label {
background: #ff4466;
}
input[type="radio"][id="children"]:checked + label {
background: #66dd99;
}
input[type="radio"][id="men"]:checked ~ .women, input[type="radio"][id="men"]:checked ~ .children {
width: 0;
height: 0;
padding: 0;
margin: 0;
opacity: 0;
}
input[type="radio"][id="women"]:checked ~ .men, input[type="radio"][id="women"]:checked ~ .children {
width: 0;
height: 0;
padding: 0;
margin: 0;
opacity: 0;
}
input[type="radio"][id="children"]:checked ~ .men, input[type="radio"][id="children"]:checked ~ .women {
width: 0;
height: 0;
padding: 0;
margin: 0;
opacity: 0;
}
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}
input[type="radio"] {
display: none;
}
input[type="radio"][id="men"]:checked + label {
background: #6666ff;
}
input[type="radio"][id="women"]:checked + label {
background: #ff4466;
}
input[type="radio"][id="children"]:checked + label {
background: #66dd99;
}
input[type="radio"][id="men"]:checked ~ .women, input[type="radio"][id="men"]:checked ~ .children {
width: 0;
height: 0;
padding: 0;
margin: 0;
opacity: 0;
}
input[type="radio"][id="women"]:checked ~ .men, input[type="radio"][id="women"]:checked ~ .children {
width: 0;
height: 0;
padding: 0;
margin: 0;
opacity: 0;
}
input[type="radio"][id="children"]:checked ~ .men, input[type="radio"][id="children"]:checked ~ .women {
width: 0;
height: 0;
padding: 0;
margin: 0;
opacity: 0;
}
相关文章推荐
- 【CSS3】---样式小技巧
- JS 获取style 里面的样式
- RS特殊报表样式需求处理
- CSS3中动画属性transform、transition 和 animation
- 纯CSS3实现图片墙
- 纯CSS3实现图片墙
- HTML CSS + DIV实现整体布局
- 【CSS3】---盒模型margin、padding及border
- 安卓最常用对话框样式。
- css背景图片的设置
- css3新特性+less试验(2)——transform
- css3圆角tab选项卡代码
- CSS选择器
- CSS
- CSS居中对齐
- css实现背景颜色线性渐变
- CSS3+less实验(1)——gradient
- css样式
- 纯css文本溢出省略(兼容IE6+、FF2.0+、Opera9.26+、sefari)
- div+css+js一级下拉菜单完美版