css调整以前的兄弟属性

时间:2017-10-03 20:58:40

标签: html css css3

我试图在第一个兄弟姐妹处于悬停状态时调整之前的兄弟姐妹。我在这里举了一个例子。我试图让它保持在100%宽度的视口,并调整你徘徊的div为60%,另一个孩子为40%。

https://jsbin.com/xucipevuzi/edit?html,css,output

这会得到下一个兄弟,但是当第一个人悬停时,我找不到一个好方法来获取前一个。

&:hover
  width 60%
  + div
     width 40%

1 个答案:

答案 0 :(得分:1)

没有CSS选择器返回HTML树(级联样式表 )

对于这种情况,您可以在悬停父级时将每个div设置为40%,并在悬停父级并将鼠标悬停在60%时将其设置为div

.two-selection:hover div
      width 40%    

.two-selection:hover div:hover
      width 60%

https://jsbin.com/risenihejo/1/edit?html,css,output