input:checked+ol:这个是讲当inoput 拥有了checked后它平级的OL拥有的样式。input:checked+ol>li:中的大于是指当inoput 拥有了checked后它平级的OL下面儿子辈的li的样式,孙子辈的不继承。
1.>(子选择器)#a>p{ // 使用 > 号,让选择器选择id="a"的所有子类(直接子类)复制代码<div id="a"> ???<p>11111111111111</p> ???<p>22222222222222</p> ???<div> <p>333333333</p> </div><!--该<p>在<div>中--></div><style> ???????#a>p ???????{ ???????????background-color:Red; ????????????} ???</style>
2.+(相邻选择器)h1+p,选择紧接在另一个元素后的元素,而且二者有相同的父元素。只会选择第一个相邻的匹配元素。复制代码<div id="a"> ???<h1>11111111111111</h1> ???<p>22222222222222</p> ???<p>33333333333333</p><!--只会选择第一个相邻的匹配元素--> ???<div> ?????<p>44444444444</p> ???</div></div>h1+p ???????{ ???????????background-color:Red; ????????????}复制代码
3.~(匹配选择器)#b~p,匹配所有在#b元素之后的同级p元素。 复制代码<style>h1~p ???????{ ???????????background-color:Red; ????????????}</style><div id="a"> ???<h1>11111111111111</h1> ???<p>22222222222222</p> ???<p>33333333333333</p> ???<div> ?????<p>44444444444</p> ???</div></div>
CSS ?选择器
原文地址:https://www.cnblogs.com/yanxiatingyu/p/9517604.html