Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Inspect Element using Safari Browser

I am developing websites and creating applications. I want to know how to inspect an element through web browsers like safari.

In normal Chrome, Firefox, Explorer or any other browsers, we will right click the mouse button or press Function Key F12 to view the Inspect Element. But it is not happening in the case of safari browser.

Share your thoughts!

like image 945
Deepak Keynes Avatar asked Oct 25 '16 08:10

Deepak Keynes


People also ask

How do I edit inspect element in Safari?

You can right-click and image and choose Inspect Element to jump to where that image is in the code. Website images typically have JPG, GIF, or PNG file extensions, though not exclusively. Double-click these image strings and you can edit them, or just save them to your system if desired.

Can you inspect element on Safari IOS?

The steps to do so are as follows: Open Safari browser. Click on Safari > Preferences > Advanced. Tick the checkbox Show Develop menu in the menu bar.


2 Answers

In your Safari menu bar click Safari > Preferences & then select the Advanced tab.

Select: "Show Develop menu in menu bar"

Now you can click Develop in your menu bar and choose Show Web Inspector

You can also right-click and press "Inspect element".

EDIT As suggested by @dennis in the comments: If you dont see "Show Develop menu in menu bar" you may need to run DevToolsSecurity -enable in the console before the option is visible

like image 117
G43beli Avatar answered Oct 08 '22 18:10

G43beli


Press CMD + , than click in show develop menu in menu bar. After that click Option + CMD + i to open and close the inspector

enter image description here

like image 25
Marina Avatar answered Oct 08 '22 18:10

Marina