html - CSS Following Siblings 选择器

Question

~ 用于下面的兄弟选择器。

我如何选择引用类 .select 的类 .content ？

HTML

<ul>
  <li> <a>content</a> </li>
  <li> <a class="select">selected li</a> </li>
  <li> <a>content</a> </li>
</ul>
<div class="content">
  selected content
<div>

CSS(不工作)

ul > li > a.select ~ .content {
  /* something */
}

Answer 1

不幸的是，CSS 是不可能的，但你可以使用 JQuery，即类似的东西

<script type="text/javascript">    
    $(".selected").parent().parent().siblings(".content").css("color", "red");
</script>

• $(".selected") 你从 'a' 标签开始
• .parent() 移动到父“li”
• .parent() 移动到父级 'ul'
• .siblings(".content") 匹配您当前所在的 'ul' 的所有同级 #content'
• .css("color", "red") 做任何你喜欢的花哨的 css ;)