我单击萤火虫图标,然后将鼠标悬停在菜单项上,以检查萤火虫CSS编辑器上的CSS
然后,我将鼠标悬停在样式编辑器上以更改其内容,并且由于菜单关闭css而失去了焦点
如何使悬停的菜单保持打开状态,以便可以使用Firebug编辑其样式?
在两种情况下,如何显示此类悬停菜单,需要以不同的方式处理
Via CSS
This means the menus are displayed using the :hover
pseudo-class. In this case you can keep the menu displayed by selecting the element reacting to the hovering within the HTML panel and then choosing the :hover option within the Style side panel's options.
Via JavaScript
This means the menus are displayed via some JavaScript event like mouseover
or click
. To be able to inspect the menus and change their styles, you need to stop the script execution as soon as a menu is hovered. If a class is added or the display
CSS property is changed on the inline style a the menu element when it's hovered, you can achieve this by right-clicking one of the menu elements within the HTML panel and choosing Break On Attribute Change from the context menu and then hovering the menu within the page. Then the script execution will be stopped and you'll be able to switch back to the HTML panel to inspect and edit the styles.
Note: The Script panel must be enabled for this to work.
除了使用仅适用于单个HTML元素的Break On Attribute Change选项之外,常规的Break On Mutate函数()也可以用于此目的。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句