css id and class

by

CSS ID and class selectors are frequently used to style web page elements. An ID selector is a unique identifier of the HTML element to which a particular style must be applied. It is used only when a single HTML element on the web page must have a specific style. A class selector is used when the same style must be applied to multiple HTML elements on the same web page .

InCSS,weuse ahash foranIDselectorandadot(.)foraclassselector.Here’sanexampleofanID selector:

Code :- 

<!DOCTYPE html>
<html>
<head>
  <title>Title of the document</title>
  <style>
    #red {color: red;}
  </style>
</head>
<body>
  <p>1. The first paragraph.</p>
  <p id="red">2. The second paragraph.</p>
  <p>3. The third paragraph.</p>
</body>
</html>

output:-

In this example, a class selector is used twice, in the heading and paragraph. We assigned blue as the class selector (class="blue") and declared its style using the color property – .blue {color: #1c87c9;} in the <head> section. It means that the elements having class selector blue will be displayed in #1c87c9. In our example, the title and the third paragraph are #1c87c9 .

example of a class selector:

Code:-

<!DOCTYPE html>
<html>
<head>
<title> Title of the document </title>
<style>
.blue { color: #1c87c9; }
</style>
</head>
<body>
<h2 class="blue"> This is some heading. </h2>
<p> The second paragraph. </p>
<p class="blue"> The third paragraph. </p>
</body>
</html>

output

Leave a Comment