How to Inspect Web Page Elements

What to Know

  • In Chrome, Firefox, or Safari: Right-click an element and select Inspect.
  • In Internet Explorer or Edge, enable inspections, right-click an element, and select Inspect Element.

This article explains how to inspect elements in Chrome, Firefox, Safari, Internet Explorer, and Microsoft Edge, including how to enable inspections in IE and Edge.

How to Inspect Web Elements With Your Browser

Websites are built from lines of code, but the results are pages with images, videos, fonts, and other features. To change one of those elements or see what it consists of, find the line of code that controls it. To do that, use an element inspection tool. You don’t have to download an inspection tool or install an add-on for your favorite web browser. Instead, right-click the page element, then select Inspect or Inspect Element. How you access this tool varies by browser, however.

This article uses rightclick to refer to the mouse device action on a Windows PC and the Control+click action on a Mac.

Inspect Elements in Google Chrome

In Google Chrome, there are two ways to inspect a web page using the browser’s built-in Chrome DevTools:

  • Right-click an element on the page or in a blank area, then select Inspect.
  • Go to the Chrome menu, then select More Tools > Developer Tools.

Use the Chrome DevTools to copy or edit the Hypertext Markup Language (HTML) markup and hide or delete elements until the page reloads.

When Chrome DevTools opens at the side of the page, change its position, pop it out of the page, search for page files, select elements from the page for a closer look, copy files and URLs, and customize the settings.

Inspect Elements in Mozilla Firefox

Mozilla Firefox has two ways to open its inspection tool, called Inspector:

  • Right-click an element on the web page, then select Inspect Element.
  • From the Firefox menu bar, select Tools > Web Developer > Inspector​.

As you move the pointer over elements in Firefox, Inspector automatically finds the element’s source code information. When you select an element, the on-the-fly search stops, and you can examine the element from the Inspector window.

Right-click an element to find the supported controls. Use the controls to edit the page as HTML markup, copy or paste inner or outer HTML markup, show Document Object Model (DOM) properties, take a screenshot of or delete the node, apply new attributes, see the Cascading Style Sheets (CSS), and more.

Inspect Elements in Safari

There are a couple of ways to examine web elements in Safari:

  • Right-click any item or space on a web page, then select Inspect Element.
  • Go to the Develop menu, then select Show Web Inspector.

If you don’t see the Develop menu, go to the Safari menu, and select Preferences. On the Advanced tab, select the Show Develop menu in menu bar checkbox.

Select individual elements on the web page to see the markup devoted to that section.

Inspect Elements in Internet Explorer

A similar inspect element tool, which is accessed by enabling the Developer Tools, is available in Internet Explorer. To enable Developer Tools, press F12. Or, go to the Tools menu and select Developer Tools.

To display the Tools menu, press Alt+X.

To inspect elements on a web page, right-click the page, then select Inspect Element. From the Internet Explorer Select element tool, select any page element to see the HTML or CSS markup. You can also disable or enable element highlighting while browsing through the DOM Explorer.

Like the other element inspector tools, use Internet Explorer to cut, copy, and paste elements and edit the HTML markup, add attributes, copy elements with styles attached, and more.

Inspect Elements in Microsoft Edge

Before you can inspect elements in Microsoft Edge, you must enable inspection. There are two ways to enable inspection:

  • Go to the address bar and enter about:flags. In the dialog box, select the Show View Source and Inspect Element in the context menu checkbox.
  • Press F12, then select DOM Explorer.

To inspect an element, right-click an element on a web page, then select Inspect Element.

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Review :  Best SSL Certificate Services to Buy
CYBERSECURITY HOSTING REVIEW Review : Best SSL Certificate Services to Buy

Note: When you click on the affiliate link in our article to purchase the product, we will earn some commission. is dedicated to security and privacy for all users. We believe the movement to encrypt nearly all web traffic is a positive development for the internet. Preventing MITM attacks and other data-interception techniques possible […]

Read More
The 10 Best Cheap Web Hosting Providers of 2021

The 10 Best Cheap Web Hosting Providers of 2021

Best Overall: HostGator, “Included in every plan is a wealth of free tools such as a free domain for one year, a drag-and-drop site builder, and more.” Best Budget: Hostinger, “A single hosting account can be as low as $.80 per month.” Best for Small Business: GoDaddy, “The GoCentral website builder has thousands of templates to get you started quickly, plus […]

Read More
The 7 Best Web Hosting Providers of 2021

The 7 Best Web Hosting Providers of 2021

The Rundown Best Overall: Hostgator, “Hostgator shines in just about every category from performance to price.” Best Budget: Hostinger, “Hostinger can get you on the web for just pennies a day.” Best Site Builder:, “The service aims to make even creating your site from scratch quick and painless.” Fastest: A2hosting, “The company does provide numerous features to help ensure its web hosting […]

Read More