Menu
I read the documentation about Firefox's page inspector. I didn't find any shortcut for inspecting an element directly without clicking the button 'choose element with mouse'. The documentation for opening the inspector itself even looks to be wrong.
You open it with cmd + option + i on OSX rather than cmd + option + c as described in the documentation.
Using Firefox v24
491
Method 1: Inspect Element Using Chrome Developer Tools At the top right corner, click on three vertical dots. From the drop-down menu, click on More tools -> Developer Tools. macOS users can use the shortcut – command + option + C and Windows users can use Control + Shift + C.
With the node picker(also called the Select Element icon). After that, as you move the mouse around the page, the element under the mouse is highlighted. Click the element to select it: Starting in Firefox 52, if you Shift + click the element, then it is selected but the picker stays active.
Enables you to interact with a web page by executing JavaScript expressions in the context of the page.
It seems that Ctrl+Shift+C always open the inspector in "choose element with mouse" mode. [Linux, FF 26.0. Also works in Chrome.]
It's not exactly the same flow as context menu -> inspect element but I find it more useful. The hover tooltip sometimes gives me all the info I need. And it's more reliable — just opening the context menu generates a mouse event while Ctrl+Shift+C doesn't. E.g. with CodeMirror which plays games with invisible elements, using context menu usually lands me in the hidden textarea or fake cursor, while "choose with mouse" mode reliably gives me the styled editor content I wanted to inspect.
110
Windows: Ctrl+Shift+C.
Mac: Cmd+Option+C.
40
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
