Image de l'article Introduction au HTML : structure de base, balises et attributs : Introduction au CSS

4.16. Introduction au HTML : structure de base, balises et attributs : Introduction au CSS

4.16. Introduction au HTML

HTML, qui est l'acronyme de HyperText Markup Language, est le langage de balisage utilisé pour développer des pages Web. Ce langage permet de créer des documents lisibles sur pratiquement n'importe quel type d'appareil connecté à Internet. HTML est la base de tout site Web ou application Web.

Structure de base du HTML

Un document HTML a une structure de base qui comprend des balises d'ouverture et de fermeture. La balise d'ouverture indique le début d'un élément et la balise de fermeture indique la fin de cet élément. De plus, un document HTML est composé d'un en-tête et d'un corps.

Le code <html> indique le début et la fin d'un document HTML. Dans cette balise, nous avons le <head> qui contient des informations sur le document, telles que le titre qui apparaît dans la barre de titre du navigateur et des liens vers des fichiers CSS et JavaScript. Le <body> contient le contenu principal du document, tel que du texte, des images, des liens, des tableaux, des listes, etc.

Balises et attributs

Les balises HTML sont les éléments qui définissent la structure du document. Chaque balise a sa propre signification et indique au navigateur comment le contenu doit être affiché. Voici quelques exemples de balises : <h1> pour les titres, <p> pour les paragraphes, <a> pour les liens, <img> pour les images, entre autres.

Les attributs sont utilisés pour fournir des informations supplémentaires sur les éléments. Ils apparaissent dans la balise d'ouverture et sont suivis d'un signe égal et d'une valeur entre guillemets. Par exemple, dans la balise <a href="https://www.example.com">Example</a>, href est un attribut qui indique l'adresse du lien.

Introduction au CSS

CSS, ou Cascading Style Sheets, est un langage de style utilisé pour décrire l'apparence d'un document écrit en HTML. Avec CSS, vous pouvez contrôler la mise en page de plusieurs pages à la fois, ainsi que divers aspects de conception tels que les couleurs, les polices et l'espacement.

Structure CSS de base

Une feuille de style CSS consiste en une liste de règles. Chaque règle ou ensemble de règles se compose d'un sélecteur et d'un bloc de déclaration. Le sélecteur pointe vers l'élément HTML que vous souhaitez styliser. Le bloc de déclaration contient une ou plusieurs déclarations séparées par des points-virgules. Chaque déclaration comprend une propriété CSS et une valeur, séparées par deux points.

Sélecteurs et propriétés

Les sélecteurs définissent les éléments auxquels la règle s'applique. Ils peuvent sélectionner des éléments par type, classe ou ID, entre autres. Les propriétés sont des aspects de l'élément que vous pouvez styliser, tels que la couleur, la police, la taille, la marge, le remplissage, etc. La valeur de la propriété définit la façon dont vous souhaitez styliser cet aspect.

Par exemple, la règle CSS ci-dessous applique la couleur rouge au texte de tous les paragraphes (<p>) :

<style>
    p {
        couleur : rouge;
    }
</style>

Dans la règle ci-dessus, « p » est le sélecteur, « couleur » est la propriété et « rouge » est la valeur.

En combinant HTML et CSS, vous pouvez créer des pages Web avec une structure et un design sophistiqués. Cependant, pour ajouter de l'interactivité et des fonctionnalités à un site Web, vous devrez apprendre JavaScript, ce qui constitue la prochaine étape pour devenir un développeur front-end.

Répondez maintenant à l’exercice sur le contenu :

Quelle est la fonction de la <tête> dans un document HTML ?

Tu as raison! Félicitations, passez maintenant à la page suivante

Vous avez raté! Essayer à nouveau.

Image de l'article Introduction au HTML : structure de base, balises et attributs : sélecteurs CSS

Page suivante de lebook gratuit :

21Introduction au HTML : structure de base, balises et attributs : sélecteurs CSS

0 minutes

Obtenez votre certificat pour ce cours gratuitement ! en téléchargeant lapplication Cursa et en lisant lebook qui sy trouve. Disponible sur Google Play ou App Store !

Get it on Google Play Get it on App Store

+ 6,5 millions
d'étudiants

Certificat gratuit et
valide avec QR Code

48 mille exercices
gratuits

Note de 4,8/5 dans les
magasins d'applications

Cours gratuits en
vidéo, audio et texte