Selectors

Universal Selector

First select all the elements mentioned in code or paragraph and it will be applied to all selected items.

Individual Selector

It will be applied on the specific paragraph or header which mentioned in the selection. It will shown the result page as the color applied.

ID Selector

Select an element on its based of the value on ID attributes. There should be only one element with a given ID in a document.

And Selector If you want change a color of a paragraph background and text color, Both changes will be applied through "and " selector.

Combine Selector

Because they combine other selectors in a way that provides them a useful relationship to one another and the position of information in the document, the final selectors we will examine are known as combinators.

Inside Selector

Inside selector as an selector of which applied the line of paragraph that already within the selector. This is the twice selector effect.

Direct Child Selector

The child combinator (>) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first.

Example:/ List items that are children of the "my-things" list / ul.my-things > li { margin: 2em; }

Sibling Selector

The adjacent sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element

Example: / Paragraphs that come immediately after any image / img + p { font-weight: bold; }

Pseudo Selector

A CSS pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s). For example, the pseudo-class :hover can be used to select a button when a user's pointer hovers over the button and this selected button can then be styled.

:: Before-

In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default.

:: After-

In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default.