CSS Selector

tutorial and example
tutorial and example

Selector: It is an HTML tag. The style will be applied on tag. CSS Selectors is based on their element name, id, and class etc.

There are various way to represent selectors. These are given below.

The Element or Type Selectors

The element selectors select elements based on element name. You can select all <h1> elements on a page. Let us consider an example.

Example of Element selector

Try Now

The Universal Selector

The universal selectors relatively match the name of any element type. Let us consider an example.

Example of Universal selector

Try Now

The Id Selector

You can use id selector by using id attribute of an HTML. The id an element should be unique define. (#) character is used to represent the Id of the element. Let us consider an example.

Example of Id selector

Try Now

The class Selector

The class selector selects elements with a specific class attribute. You must have to use (.) character while using class. Let us consider an example.

Example of class selector

Try Now

The Grouping Selector

Grouping selector is used to select multiple selectors. You must have to use separator (, ) character between the element . Let us consider an example.

Example of Grouping selector

Try Now

  • Property: It is a type of attribute of HTML. The HTML attributes are covered into CSS properties. Like color, border, margin etc.
  • Value: It is assigned to properties. Like #8BC34A, #fff etc.

The given above example, you can define a headline background-color as follows.

Here h1(headline) is a selector, background-color is a property and #8BC34A is the value of that property.