All major browsers come bundled with developer tools, which allow us, among many other things, to locate how a style is applied to a particular element, this is very helpful if we are looking to modify said style.

Web developer tools can be accessed by pressing the F12 key, or right clicking in the page and selecting Inspect Element¬Ě (in most browsers)

The layout of the developer tools differs a little between browsers, but the basics we need to use here, are pretty similar in all of them. We recommend to use Google Developer Tools.

 

What can do for you Google Developer Tool?

When you need to inspect for several parts of your page to find styles, that are responsible for that part, find out the structure, inspect class names or find ID of particular element on page. How does it work? Simple: just put the mouse cursor on the element you want to inspect and make a right click >> choose inspect element, and google developer console will open with styles and structures located on that part you inspected.

 
495