微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

当另一个特定的 NESTED 元素在前面时,如何不选择一个元素?

如何解决当另一个特定的 NESTED 元素在前面时,如何不选择一个元素?

我正在尝试选择所有 <ul> 元素,这些元素Not 之前是一个 <mark> 元素直接嵌套在一个 <p>元素。

换句话说

我只想选择不跟随带有 <ul> 元素的段落 <p> 元素作为其最后一个子元素的 <mark> 元素。


我尝试了多种方法,例如 p:not(p > mark) + ul{}p:not(p) > mark + ul{}
但是 CSS 规则选择太多(所有 ul 元素)或太少(根本没有 ul 元素)。

我忽略了什么?谢谢! js fiddle demo

/* CSS */
/* Select ul elements that are not preceeded by a nested <mark> element as last child of the preceding paragraph p element */

p:not(p > mark) + ul{
  margin-top: 2em;
  }
<p>
  Text Text Text
</p>

<ul>
  <!-- This ul element should BE selected -->
  <!-- There should be a margin above this list -->
  <li>List item</li>
  <li>List item</li>
  <li>List item</li>
</ul>


<hr>


<p>
  Text Text Text<br>
  <mark>Marker</mark><!-- Look out for this element inside preceding paragraph -->
</p>

<ul>
  <!-- This ul element should NOT be selected -->
  <!-- There should be NO margins above this list -->
  <li>List item</li>
  <li>List item</li>
  <li>List item</li>
</ul>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。