4.17. Introduction au HTML : structure de base, balises et attributs : sélecteurs CSS
HTML, qui signifie Hyper Text Markup Language, est le langage de balisage standard pour la création de pages Web et d'applications. Avec CSS et JavaScript, HTML est une technologie fondamentale utilisée sur la plupart des sites Web. HTML fournit la structure d'une page Web, tandis que CSS stylise cette structure et JavaScript permet l'interactivité sur la page.
Structure de base d'un document HTML
Un document HTML a une structure arborescente, qui commence par un élément racine <html>. Cet élément contient deux éléments enfants : <head> et <body>. La <head> contient des métadonnées sur le document, tandis que le <body> contient le contenu principal du document.
<html>
<head>
<title>Titre de la page</title>
≪/head>
<body>
Contenu de la page...
</body>
</html>
Balises et attributs HTML
Les balises HTML sont utilisées pour définir des éléments HTML. Chaque balise HTML commence par le crochet angulaire (<) et se termine par le crochet angulaire (>). La plupart des balises HTML ont une balise d'ouverture et une balise de fermeture, avec du contenu entre les deux. Par exemple, <p>Texte</p>.
Les attributs HTML sont utilisés pour fournir des informations supplémentaires sur les éléments. Ils sont toujours spécifiés dans la balise d'ouverture et se présentent généralement sous forme de paires nom/valeur. Par exemple, <a href="https://www.example.com">Link</a>.
Présentation des sélecteurs CSS
Les feuilles de style en cascade (CSS) sont un langage de feuille de style utilisé pour décrire l'apparence d'un document écrit en HTML. CSS décrit comment les éléments HTML doivent être affichés, contrôlant la mise en page de plusieurs pages à la fois.
Sélecteurs CSS
Les sélecteurs CSS sont utilisés pour sélectionner les éléments HTML que vous souhaitez styliser. Il existe plusieurs types de sélecteurs CSS, notamment les sélecteurs de type, les sélecteurs de classe, les sélecteurs d'ID, les sélecteurs d'attributs, etc.
· Sélecteurs de type : sélectionnez les éléments en fonction du type d'élément. Par exemple, "p" sélectionnera tous les éléments <p>.
· Sélecteurs de classe : sélectionnez des éléments en fonction de l'attribut de classe. Par exemple, '.intro' sélectionnera tous les éléments avec class="intro".
· Sélecteurs d'ID : sélectionnez des éléments en fonction de l'attribut ID. Par exemple, '#firstName' sélectionnera l'élément avec id="firstName".
· Sélecteurs d'attribut : sélectionnez des éléments en fonction d'un attribut ou d'une valeur d'attribut. Par exemple, '[target="_blank"]' sélectionnera tous les éléments avec target="_blank".
En conclusion, HTML, CSS et JavaScript sont des technologies essentielles pour devenir développeur front-end. Apprendre la structure de base du HTML, les balises et attributs HTML et les sélecteurs CSS est la première étape pour devenir un développeur Web professionnel. L'étape suivante consiste à apprendre à utiliser JavaScript pour ajouter de l'interactivité à vos pages Web.