鼠标悬停后出现的样式,我们遇见的有两种情况,一种是用css设置的hover时的样式,第二种就像el-tooltip组件,鼠标悬停时出现提示文字的样式。
一、css设置的hover时的样式
1、按【F12】键(或右键点击【检查】)打开调试模式,定位到要查看的元素,点击右下角的【:hov】,选中【:hover】,下面就会出现给这个元素设置的css样式,进而查看或修改样式。
二、非css设置的鼠标悬停时的元素样式
1、按【F12】键(或右键点击【检查】)打开调试模式
2、找到自己悬浮的元素,右键点击后,不要乱点
3、移入调试面板,按下【N】键,就自动定位到目标元素了,接下来就可以查看和调试想要的样式了。
要是不小心没了,继续【右键】--->【N】。
确实好好使!
三、非css设置的鼠标悬停时的元素样式(Mac电脑适用)
1、fn + F12 打开调试模式
2、打开Sources(源代码)
3、找到触发悬浮的元素,鼠标放上去后,按下Command + \ ,然后移动鼠标,就会变成下面这样
4、接下来,就可以把悬浮的元素当作普通元素在浏览器上查看或修改样式了
5、完事之后,点击上面的箭头就可以变回正常模式了