Articles on: Getting Started
This article is also available in:

How to inspect elements of a website?

Most modern browsers offer tools for inspecting the various elements of a website. These tools allow to know all the code and commands gives the site its appearance and its functionality.

Item inspection is commonly used by web developers to help with design configuration. For example, this tool can tell which command line in which file determines the color of a button. If an item on your site needs to be edited manually, this tool can help you identify the item in question.

Inspect website elements on various browsers



By default, Chrome, Firefox and Edge provide access to the item inspection function. In the case of Safari, the tool must first be enabled before it can be used. To do this, you must check the check box in the advanced settings of the browser.

To inspect an item, simply right click on it. From the drop-down menu, select the Inspect option.



A new window should appear to the right of the one you want to inspect, separating your screen. This should contain a set of lines of code that look like this:



These lines contain a wealth of information about the programming of the various elements element of the inspected page. You can find there the nature of the various elements of content as well as various parameters associated with them (color, margins, etc.).

You can inspect the various items on page by selecting the inspection tool from the menu.



Simply hover over the page with your cursor to see information on the various elements. You will also see the code window scroll to adjust. The inspection tool will always highlight the code related to the item you are inspecting.



These lines contain a wealth of information about the programming of the various elements element of the inspected page. You can find there the nature of the various elements of content as well as various parameters associated with them (color, margins, etc.).

You can inspect the various items on page by selecting the inspection tool from the menu.



Simply hover over the page with your cursor to see information on the various elements. You will also see the code window scroll to adjust. The inspection tool will always highlight the code related to the item you are inspecting.

Updated on: 14/04/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!