浏览器调试css hover元素 --2025-08-14

1. 背景

每次hover元素，离开目标元素，浮层都会消失，不方便调试

4. 方法1

如果是纯css 写的hover，勾选:hover即可保持

image.png

2.方法2

• 1. 使用 浏览器 f12的Components的功能

     
     
     image.png

• 2. 选中目标元素，修改props.visible=true

     
     
     image.png
• 3. 注意：Anonymous 匿名组件不允许修改props，可以使用下面方法

3. 方法3

利用js的单线程特性，当鼠标hover到元素的时候，在控制台输入debugger，然后回车，页面就进入调试状态了。这个方法简单好用。

image.png