CSS - 在另一个样式列表中添加列表,而不使用其样式

Question

好的,请允许我解释一下.

这是HTML:

<ul class="children">
   <li class="bypostauthor">
    This image should have borders:
    <img width="67" height="67" src="http://i.imgur.com/BRUVD7s.jpg">
    <ul class="children">
     <li>
      This should NOT have borders:
      <img width="67" height="67" src="http://i.imgur.com/BRUVD7s.jpg"> 
     </li>
    </ul>
   </li>
</ul>

和CSS:

.bypostauthor img{
 border:5px solid red;
}

我想为列表类中的图像添加边框bypostauthor,而不是列表中的图像.

例如,请看这个小提琴.

不幸的是,我无法为图像本身添加一个唯一的类.仅限于父列表.

Answer 1

更改:

.bypostauthor img{
    border:5px solid red;
}

至:

.bypostauthor > img{
    border:5px solid red;
}

请参阅儿童选择器