V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
dreamer
V2EX  ›  问与答

Chrome 开发者工具如何查看 :hover 样式?

  •  
  •   dreamer · Nov 5, 2012 · 13598 views
    This topic created in 4929 days ago, the information mentioned may be changed or developed.
    在 Firefox 下使用 Firebug 查看某个元素的时候,如果该元素设置了 :hover 样式,那么鼠标移动上去之后,Firebug 就会自动给出元素的 :hover 样式 css 代码。

    但是在 Chrome 下用开发者工具的时候,当我查看某个元素,鼠标移动上去之后元素样式改变了,但是开发者工具里面没办法查看到当前样式的 css 代码,是不是 Chrome 开发者工具目前还不支持?
    7 replies    1970-01-01 08:00:00 +08:00
    xlaok
        1
    xlaok  
       Nov 5, 2012
    记得前不久有人问过类似的

    选中元素后,在开发者工具右上角有个小箭头一样的东西,点击一下就能选:hover等等了
    skydiver
        2
    skydiver  
       Nov 5, 2012   ❤️ 1
    iuhoay
        3
    iuhoay  
       Nov 5, 2012
    zhy0216
        4
    zhy0216  
       Nov 5, 2012
    或者在弹出的html代码那里, 要hover的元素那里右键, 有个force element state, 选hover
    botao1
        5
    botao1  
       Nov 5, 2012
    @skydiver 请问Firebug有类似的功能么?
    dreamer
        6
    dreamer  
    OP
       Nov 5, 2012
    @skydiver
    @iuhoay
    @zhy0216

    多谢各位,了解了!
    YFZZ
        7
    YFZZ  
    PRO
       Oct 23, 2013
    @skydiver
    @iuhoay

    这个每次都要手动去点,可以设置成类似 Firebug 那样“常驻”显示的吗?
    就是鼠标已经过某元素,他的 :hover 样式就会显示出来。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2826 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 118ms · UTC 07:31 · PVG 15:31 · LAX 00:31 · JFK 03:31
    ♥ Do have faith in what you're doing.