為什麼 :hover 不能與 Webkit 瀏覽器中的相鄰同級選擇器一起正常運作？

具有多個相鄰兄弟選擇器的Webkit 錯誤

在Webkit 瀏覽器（Safari、Chrome）中，使用:hover 偽值時會出現問題-具有多個相鄰兄弟選擇器的類別。以下程式碼說明了這個問題：

div:hover + a + div {}

將滑鼠停留在

上時元素，樣式未正確套用。但是，如果將滑鼠停留在 上，首先是

，樣式會按預期套用。

新增通用同級選擇器，如：

div:hover ~ div {}

無論是否宣告樣式，都會解析問題。

此Webkit 錯誤的解決方法是在body 元素上偽造動畫：

body {
  -webkit-animation: bugfix infinite 1s;
}

@-webkit-keyframes bugfix {
  from {
    padding: 0;
  }

  to {
    padding: 0;
  }
}

可以在此處查看實際效果：https://jsfiddle.net/jalbertbowdenii/ ds2yY/1 /.

以上是為什麼 :hover 不能與 Webkit 瀏覽器中的相鄰同級選擇器一起正常運作？的詳細內容。更多資訊請關注PHP中文網其他相關文章！