input:checked+ol:这个是讲当inoput 拥有了checked后它平级的OL拥有的样式。
input:checked+ol>li:中的大于是指当inoput 拥有了checked后它平级的OL下面儿子辈的li的样式,孙子辈的不继承。
Html代码
复制代码代码如下:
用户界面(UI)元素状态伪类选择符 E:checked_CSS参考手册_web前端开发参考手册系列input[type=radio]:checked + span{background:blue;}
input[type=radio]:checked + span:after{content:" 我被选中了";}
input[type=checkbox]:checked + span{background:#f00;}
input[type=checkbox]:checked + span:before{content:" 我被选中了";}
div.classFather > div.classSon div.classSon{
background-color: lightgray;
line-height: 40px;
}
div.classFather > div.classSon > div.classSonS > div.classSonC {
background-color: lightgray;
line-height: 40px;
}
选中下面的项试试
- 蓝色
- 红色
- 黑色
选中下面的项试试
- 蓝色
- 红色
- 黑色
子节点样式
孩子
孙子
重孙子
孩子
孙子
重孙子