what is CSS selectors?
A CSS selector selects the HTML element(s) you want to style. In CSS, selectors are used to target the HTML elements on our web pages that we want to style. There are a wide variety of CSS selectors available, allowing for fine-grained precision when selecting elements to style. In this article and its sub-articles we'll run through the different types in great detail, seeing how they work.
Type selectors
These are selectors used to match elements in the DOM, such as p, div, span, and even customized tags.
Class selectors
These are used to select elements in the DOM that have a specific class as an attribute. For this, you have to add a . to the beginning of the name you want to match.
ID selectors
These will match elements with a specific identifier associated with it. For this type of selector, you have to use a # before the ID you want to match.
Universal selector
This one is used to match all the elements in the page. It can be used to reset margins and paddings for all elements, for instance. However, it is not indicated since it can overload the rendering process of your page.
Attribute selectors
These will match elements that have a specific attribute associated with it. This can be used to match both individual attributes and attributes associated with their values. For this type of selector, you must surround the attribute name with square brackets.
That's all for now I'll share more in next Post.
Top comments (1)
I use a lot of attribute selectors, because I use it for distinguish the same structure for a different aim. Very helpfull ;)