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

4.22. Introduction au HTML : structure de base, balises et attributs : Media Queries

Introduction au HTML

HTML, ou HyperText Markup Language, est le langage standard pour la création de pages Web et d'applications. Il s'agit d'un langage de balisage, ce qui signifie qu'il fournit une structure au contenu sur le Web et décrit à quoi ressemble ce contenu.

Structure de base

Un document HTML de base a une structure spécifique, comprenant des éléments doctype, header et body. Le doctype déclare que la page est un document HTML. L'élément d'en-tête contient des métadonnées sur le document, telles que le titre de la page, tandis que le corps contient le contenu de la page, tel que du texte, des images, des listes, des liens, etc.

<!DOCTYPE html>
<html>
<head>
    <title>Titre de la page</title>
≪/head>
<body>
    Contenu de la page ici.
</body>
</html>

Balises et attributs

Les balises HTML sont les éléments constitutifs d'une page HTML. Ils définissent et décrivent le contenu. Chaque balise commence par un crochet angulaire (<) et se termine par un crochet angulaire (>). Quelques exemples de balises HTML incluent <h1> pour les titres, <p> pour les paragraphes, <a> pour les liens, etc.

Les attributs HTML fournissent des informations supplémentaires sur les éléments. Ils se présentent sous forme de paires nom/valeur et sont toujours inclus au début de la balise. Par exemple, la balise de lien (<a>) inclut souvent l'attribut « href », qui indique l'URL vers laquelle mène le lien.

<a href="https://www.example.com"> Ceci est un lien vers Exemple.com</a>

Requêtes multimédias

Les Media Queries sont une technique CSS qui vous permet d'adapter la mise en page et le design d'une page Web à différents appareils et tailles d'écran. Ils constituent un élément crucial du design réactif.

Une requête multimédia se compose d'un type de média et d'une ou plusieurs expressions qui vérifient les conditions de certaines ressources du périphérique. Par exemple, vous pouvez utiliser une requête multimédia pour appliquer un ensemble de styles CSS si la largeur de la fenêtre du navigateur est inférieure à 600 px.

Écran @media et (largeur maximale : 600 px) {
  corps {
    couleur de fond : bleu clair ;
  }
}

Dans cet exemple, l'arrière-plan de la page sera bleu clair si la largeur de la fenêtre du navigateur est inférieure à 600 px.

Les Media Queries sont un outil puissant permettant de créer une expérience utilisateur optimisée pour différents appareils. Ils vous permettent de créer des conceptions qui répondent aux changements de l'environnement de l'utilisateur, tels que la taille de l'écran, l'orientation (portrait ou paysage) et la résolution de l'écran.

En conclusion, HTML est le fondement de toute page Web. Comprendre la structure de base du HTML, les balises et les attributs, ainsi que comment utiliser Media Queries pour créer des conceptions réactives est essentiel pour devenir un développeur front-end efficace.

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

Que sont les requêtes multimédias en 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 : Introduction à JavaScript

Page suivante de lebook gratuit :

27Introduction au HTML : structure de base, balises et attributs : Introduction à JavaScript

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