CSS选择器层次？如何进行逆向工程以获得造型？

Question

.post .post_author div.author_avatar img {

}

编辑：要清楚，我有一个给定的CSS规则集，我想应用于我的html，我想知道如何在规则指定一组类时设置html来应用规则集

如何从CSS中重现html中的选择器？

<div class="post post_author author_avatar"><img /></div>

不能给我css样式吗？

Answer 1

试试.post.post_author.author_avatar img。

Answer 2

您的选择器代表

  

img元素
  这是具有div类的.author_avatar元素的后代   这是具有.post_author类的元素的后代   这是具有.post类的元素的后代。

这些类中的每一个都由一个单独的元素表示。每个选择器之间的空间是后代组合子。因此，您需要创建最多三个div（或其他元素，具体取决于您的布局，但.author_avatar必须是div）：

<div class="post">
  <div class="post_author">
    <div class="author_avatar">
      <img />
    </div>
  </div>
</div>