Usually, when we debug web app, we just hover over our mouse in a element, then we right click it and choose "Inspect". What is terminology of this? What is keywords I can use for searching about this technology? I want to read more tutorial to master this debug method since I since it is very very helpful and useful.
Update: Actually I just want to know a element's css class, so then I can display or hide this element.
Developer Console is the most important tool in web development and without it, any web developer can hardly imagine about web page development. It is more important than any IDE we use for development.
Inspecting an element on the browser called Client debugging or UI debugging. This happens on Developer console which comes by default with every browser. You can inspect an element on by mouse right click > Select inspect OR Press F12.
In above image, you can see the element selected is BODY and the CSS aligned with the tag property is visible in the same console under style tab at right-hand side. When you will hover on any CSS property, a checkbox will appear and it will allow you to remove or add the property to selected element.
On the same side, there are multiple options which you can apply on css. Eg. If you want to apply some property on hover, click on the filter and select the state of the element.
This way, you can play with elements on the page and then finalize the element style you are looking for.
[NOTE: Making changes on developer console does not get saved in the actual file. You must need to copy them to source file and then refresh the page to see them working]
Hope this helps, Cheers!