css - 这个 :nth-child 规则是怎么回事？

Question

小提琴

具体来说，为什么我的#sumMenu2 p:nth-child(2)规则没有出现？

html:

<div id="subMenu2">
    <p class="active">Panel View</p>
    <p>Group View</p>
    <p>Photocell Settings</p>
</div>

CSS：

#subMenu2 {
    background: pink;
}
#subMenu2 p {
    color: black;
    text-decoration: none;
    padding: 5px 25px 5px 25px;
    display: block;
    float: left;
}
#sumMenu2 p:nth-child(2) {
    border-right: 1px solid black;
    border-left: 1px solid black;
}

Answer 1

因为你拼写了#sumMenu2？

#sumMenu2 p:nth-child(2) {
border-right: 1px solid black;
border-left: 1px solid black;