1

これは単純な CSS と思われる単純な HTML です (2 つの項目はリンクであり、2 つの項目はリンクではないことに注意してください)。

<html>
  <head>
    <style>
      li.menu:hover {
        background-color: #0ff;
      }

      li.menu a {
        background-color: #0f0;
      }

      li.menu a:hover {
        background-color: #00f;
      }
    </style>
  </head>
  <body>
    <ul>
      <li class="menu"><a>item1</a></li>
      <li class="menu"><a>item2</a></li>
      <li class="menu">item3</li>
      <li class="menu">item4</li>
    <ul>
  </body>
</html>

現在、Firefox では期待どおりに動作しますが、Chrome (v24) では動作しません。

item1 と item2 は、ホバーしてい#0f0ないときは (緑) 色、ホバーしているときは#00f(青) の色になると思います。しかし、それらは常に緑色です (Chrome では)! では:hover、item3 と item4 では機能するのに、item1 と item2 では機能しないのはなぜでしょうか?

Chromeでも機能し、それでもこれほど簡単な方法はありますか?

4

1 に答える 1