如何在 Chrome DevTools 中查看和操作 :hover 樣式？

在Chrome 開發者工具中查看:hover 狀態

與Firebug 不同，Firebug 提供了用於選擇下拉元素狀態的專用樣式菜單，Chrome開發者工具提供更微妙的方法：懸停

解決方案：

訪問:hover 規則並操作其狀態：

1. 啟用偽類顯示: 點選「樣式」窗格右上角的小「:hov」文字。這將在常規 CSS 規則旁邊顯示 :hover 規則。
2. 強制 :hover 狀態： 右鍵點選「元素」面板中所需的元素，然後從上下文選單中選擇「:hover」 。這將強制元素進入懸停狀態，允許您檢查其應用的樣式。

其他提示：

• 有關更多鍵盤快捷鍵和元素面板中的功能，請參閱 Chrome 開發者工具快捷方式文件。
• 作為替代方案，您可以使用 Chrome 擴充功能「切換元素狀態」快速切換不同元素狀態。

以上是如何在 Chrome DevTools 中查看和操作 :hover 樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！