Question

有没有办法合并两个相邻兄弟姐妹的CSS？我有一些wordpress主题生成的代码，我想用css修改。

对于下面的代码，当类“myclass”也被赋予类名“john”时，我想隐藏p“hide-me”

希望有这样的东西：（.first-sibling .myclass.john）〜（。second-sibling .hide-me）{display：none;}

<div class="parent">
  <div class="first-sibling">
    <p class="myclass john">Paragrah to determine the hiding of hide-me</p>    
  </div>

 <div class="second-sibling">
   <p class="hide-me">Hide this if myclass has a class named "john" </p>  
 </div>

谢谢

Answer 1

要使用当前的HTML实现您的要求，您需要使用Javascript。你的另一个选择是如果你可以将类john应用到parrent那么你就可以拥有这样的CSS并且它可以工作：

.first-sibling.john + .second-sibling{
  display: none;
}

这是一个JS小提琴 https://jsfiddle.net/exk0ex8c/1/

您还可以进一步操作HTML，以便两个p元素位于相同的div下，然后进一步使用CSS选择器来完成此操作。有关所有CSS选择器的列表，您可以在此处查看：http://www.w3schools.com/cssref/css_selectors.asp

结合两个相邻兄弟姐妹的CSS

1 个答案: