Developer Tools on Different Browsers
Every modern web browser includes its own set of developer tools as the introduction blow.
You can target a specific element by right-clicking in the page and selecting Inspect
.
Google Chrome
The Chrome DevTools are a set of web authoring and debugging tools built into Google Chrome. Use the DevTools to iterate, debug and profile your site. To learn more, click here.
To open Chrome DevTools.you can use the shortcuts:
- Command + Option + i (Mac)
- Ctrl + Shift + i (Windows/Linux).
- Open the Chrome settings menu in the top-right corner of your browser window and select
More Tools
>Developer Tools
.
Mozilla Firefox
The shortcuts:
- Command + Option + i (Mac)
- Ctrl + Shift + i (Windows/Linux).
- Open the Chrome settings menu in the top-right
To learn more, click here
Internet Explorer
The shortcuts:
- Pressing
F12
- Command + Option + i (Mac)
- Ctrl + Shift + i (Windows/Linux).
- Open the Chrome settings menu in the top-right
The features vary between versions, but starting at Internet Explorer 8 remain pretty consistent.
Below, we've linked to documentation for each version, but if you've upgraded to Microsoft Edge, then check the next section.
Microsoft Edge
Just like Internet Explorer, to open developer tools in Microsoft Edge simply press F12
.
F12 developer tools documentation is now fully available on GitHub.
To learn more, click here.
Safari
For any Mac users, Safari includes Web Inspector, a powerful tool that makes it easy to modify, debug, and optimize a website for peak performance and compatibility on both platforms. To learn more, click here.
The shortcut:
- Develop menu in Safari’s Advanced preferences
- Right-click on any page element and select Inspect Element
- Command + Option + i
Opera
Fast, lean and powerful, Opera comes pre-packed with a fully-featured suite of developer tools. Named Opera Dragonfly, it is designed to make your job easier. To learn more, click here.
Launch Opera Dragonfly with the following keyboard shortcuts:
- Command + Option + i (Mac)
- Ctrl + Shift + i (Windows/Linux).