CSS Selector:-

CSS selector selects the HTML element you want to style.

CSS selectors are used to select or find the HTML elements you want to style.

We can divide the CSS selector into 5 portions:

  • Simple select (select an element on the base of id, class)
  • Combinator selector (select an element on the basis of the relationship between them)
  • Pseudo class selector (select an element based on an certain state)
  • Pseudo element selector (select and style a part of an element)
  • Attribute selector (select an element based on attribute or attribute value)

CSS element selector:-

In CSS element selector all the elements will be affected with this if we use element selector.


<!DOCTYPE html>

<html>

<head>

p{text-align: center;

color: red;

}

</head>

<body>

<p> This is a paragraph.</p>

<p id="sami"> Me also!</p>

<p> And I am also!</p>

</body>

</html>

Try this code for a better experience 


CSS id selector:-

Id selector use when you want to style one or some specific elements.

The id of any element will be unique in an HTML page.

For selecting an element in HTML page use # for denoting id for specific attribute.


<!DOCTYPE html>

<html>

<head>

#sami{text-align: center;

color: red;

}

</head>

<body>

<p id="sami">Hello world</p>

<p> This is a paragraph in above paragraph we will use id selector for specific attribute.</p>

</body>

</html>

Try this code for a better experience 


NOTE:- An id name cannot start with a number.