Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Attributes, Classes, Ids, and Styles | Understanding Basic Elements
HTML for Beginners
course content

Contenu du cours

HTML for Beginners

HTML for Beginners

1. Understanding Basic Elements
2. Working with Semantic Elements, Multimedia Elements and Graphics
3. Working with Advanced Elements

book
Attributes, Classes, Ids, and Styles

In our last lesson, we learned that the <a> tag uses an attribute called href. Attributes are used to provide additional instructions to a specific tag. We can assign values to most of the attributes. So they often behave like variables.

Attributes are permanently attached to a particular element. The purpose of an attribute is different from one to another. There are mainly two types of attributes: global attributes and element-based attributes. The most popular global attributes are id, class, and style.

Id attribute

It is used to recognize an element uniquely. This is helpful when writing CSS or Javascript codes targeting that specific element later.

html

index.html

copy

They don't change anything in the presentation of the code. However, if you want to change the color of this specific paragraph, you can write CSS code using the id element, as shown below.

html

index.html

css

index.css

copy

Class attribute

The class attribute is used to categorize a set of elements. You can give the same class for several elements. So you can write CSS and Javascript codes targeting that set of elements.

html

index.html

copy

Here first, second and fourth paragraphs belong to the "welcome" class. You can write CSS code to change those three sentences leaving the third one unchanged.

html

index.html

css

index.css

copy

Styles

A style attribute is used to write inline CSS for an HTML element. The format for style attribute is:

html

index.html

copy

You can use hundreds of CSS properties with the style attribute.

There are other global attributes. But they are not commonly used. Apart from global attributes, there are a lot of attributes that can be used only with certain elements. You will learn a lot about them in future chapters.

1. Which attribute is used to uniquely recognize an element?

2. How to change the color of a heading?

 Which attribute is used to uniquely recognize an element?

Which attribute is used to uniquely recognize an element?

Sélectionnez la réponse correcte

How to change the color of a heading?

How to change the color of a heading?

Sélectionnez la réponse correcte

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 3
We're sorry to hear that something went wrong. What happened?
some-alt