css - css hover ネストされたクラスが伝播する

Question

これが古典的なものであることは知っていますが、ネット上で答えが見つかりません:

私はこのhtmlコードを持っています:

<div class="comment>
  <div class="myLinks">Some Links</div>
  <div class="comment">
    <div class="myLinks">Some Links</div>
  </div>
</div>

次に、この css (scss で記述) があります。

.myLinks {
  display: hidden;
}

.comment {
  &:hover {
    .myLinks {
      display: visible;
    }
  }
}

ポインターが最初のコメントブロックの上に移動すると、ネストされたコメントブロックのホバー効果もアクティブになります。私が望むのは、彼の親や子供ではなく、ホバリングされているコメントにのみリンクが表示されるようにすることです。

これどうやってするの？ありがとう！

score 9 · Accepted Answer

9

.myLinks{
  display:none;
}

.comment:hover > .myLinks {
  display: block;
}

于 2012-12-10T09:45:18.910 に答える

score 0 · Accepted Answer

このCSSに慣れている

.myLinks{
display:none;
}

.comment:hover .myLinks{
display:block;
}

また

-------

.myLinks{
    visibility:hidden;
    }

    .comment:hover .myLinks{
    visibility: visible;
    }