Question

css中input:checked + ol和input:checked + ol > li 中的+和>都是什么意思啊？整体怎么理解？

Answer 1

第一条规则：

拆分解释：

input、ol都为标签选择器，选择标签名为input和ol的所有标签

:checked，选择勾选状态的元素（input为checkbox的，并且已经勾选）

+为兄弟选择器，代表+两侧的元素是前后紧邻的

整体解释：选择紧邻前面的标签为选中的checkbox（input type=checkbox）的ol标签（选择器选的是ol而不是input）

第二条规则：

拆分解释：

input、ol、li为标签选择器

>子元素选择器，表示>之前的元素是后面元素的父级元素

整体解释：选择被选中的input紧邻的ol元素的子元素li

举例，下面的li会匹配input:checked + ol > li 

<input type="checkbox" />
<ol>
    <li>选择的是这个元素,前提是上面的checkbox已经被勾选了</li>
</ol>

Answer 2

input:checked+ol:这个是讲当inoput 拥有了checked后它平级的OL拥有的样式。
input:checked+ol>li:中的大于是指当inoput 拥有了checked后它平级的OL下面儿子辈的li的样式，孙子辈的不继承。