验证 css 悬停状态被激活
我有一个网站,背景图像在悬停状态下会跳起来,但我一生都找不到执行此操作的特定 CSS。
我能够到达“有问题的”链接并给它一个边框并更改填充和边距。问题是 Firebug 和 chrome Inspect 没有向我显示悬停状态下发生的情况。
所以我想要一种方法来查看 :hover 上发生了哪些正常 css 状态的添加。
有什么指点吗?
(PS IE 8没有这个问题——即背景图像没有跳跃)
I have a site where the background-image jumps up on hover state and I can't for the life of me find the specific css that does this.
I'm able to get to the "offending" link and give it a border and change the padding and margin. The problem is that firebug and chrome inspect does not show me what happens on the hover state.
So I want a way to see what additions to the normal css state happens on :hover.
Any pointers?
(P.S. IE 8 doesn't have this issue - ie no jumping of background image)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
尝试使用 FireBug 中的 Inspect 功能来关注有问题的元素。它将向您显示所有相关的 CSS,包括与 :hover 相关的任何 CSS。您还可以通过这种方式查看鼠标悬停时元素 CSS(以及任何其他 DOM 属性)发生的变化。
如果更改来自某些 JavaScript,请尝试 Visual Event 书签。在页面上激活它将使您看到与相关元素相关的所有事件。
Try using the Inspect function in FireBug to focus in on the element in question. It will show you all related CSS, including any CSS that is related to :hover. You can also see in this way what changes happen to the elements CSS (and any other DOM attribute) when you hover your mouse.
In case the changes are coming from some JavaScript, try out the Visual Event bookmarklet. Activating it on the page will let you see all events that are tied to the element in question.