Html5 Tutorial

Class VS Id in HTML5 | Difference Between Class and Id in HTML5

The difference between an ID and a class is that an ID can be used to identify one element, whereas a class can be used to identify more than one.

When comparing CSS class vs ID, the difference is that CSS class applies a style to multiple elements. ID, on the other hand, applies a style to one unique element. ID is also special in that you can use a special URL to link directly to an element and it’s used by JavaScript.

In CSS, selectors are used to targeting a specific element or range of elements on a web page. Once an element has been targeted, a style or set of styles can be applied to the element.

CLASS SELECTOR

The class selector selects elements with a specific class attribute. It matches all the HTML elements based on the contents of their class attribute. The . symbol, along with the class name, is used to select the desired class.

SYNTAX

.class-name {
  /* Define properties here */
}

ID SELECTOR

The ID selector matches an element based on the value of its id attribute. In order for the element to be selected, its ID attribute must exactly match the value given in the selector. The # symbol and the id of the HTML element name are used to select the desired element.

SYNTAX

#idname {
  /* Define properties here */
}

DIFFERENCE BETWEEN CLASS AND ID SELECTOR

The difference between an ID and a class is that an ID is only used to identify one single element in our HTML. IDs are only used when one element on the page should have a particular style applied to it. However, a class can be used to identify more than one HTML element.