Balises HTML de base
Comprendre les balises HTML de base est important lorsqu’on apprend HTML. Voici les éléments HTML qui sont utilisés plus fréquemment que les autres. Il s’agit de :
Documents HTML
Tous les documents HTML doivent commencer par une déclaration qui spécifie le type de document : <!DOCTYPE html>.
Le document HTML commence par <html> et se termine par </html>.
La partie principale du document HTML se trouve entre <body> et </body>.
Exemple d’un document HTML :
Exemple d’un document HTML :
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<p>Here is the paragraph.</p>
</body>
</html>Titres HTML
Les éléments de titre sont utilisés pour structurer les en-têtes. Il existe six types de titres HTML, allant de <h1> à <h6>.
Exemple des titres HTML :
Exemple d’un titre|Balises HTML de base|W3Docs
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>Résultat
Paragraphes HTML
L’élément <p> est utilisé pour séparer les paragraphes HTML.
Exemple des paragraphes HTML :
Exemple d’un paragraphe|Balises HTML de base|W3Docs
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h2>Elements example</h2>
<p>This is some paragraph.</p>
<p>This is another paragraph <br /> with line break.</p>
</body>
</html>Résultat
Images HTML
Les attributs de cette balise sont :
- le fichier source (src),
- le texte alternatif (alt),
- la largeur,
- la hauteur.
La balise <img> est utilisée pour insérer des images HTML.
Exemple des images HTML :
Exemple d’une image|Balises HTML de base|W3Docs
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h1>This is an image example</h1>
<img src="https://fr.w3docs.com/uploads/media/default/0001/01/25acddb3da54207bc6beb5838f65f022feaa81d7.jpeg" alt="Aleq" width="200" height="185">
</body>
</html>Résultat
Liens HTML
La balise <a> est utilisée pour insérer des liens HTML. Vous pouvez spécifier la destination du lien à l’aide de l’attribut href.
Exemple des liens HTML :
Exemple d’un hyperlien|Balises HTML de base|W3Docs
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<a href="https://www.w3docs.com/">W3docs.com</a>
</body>
</html>Résultat
Boutons HTML
Vous pouvez définir les boutons HTML avec la balise <button>.
Exemple de la balise HTML <button> :
Exemple de la balise HTML<button>
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h1>Example of the HTML <button> tag:</h1>
<p>You can specify the HTML buttons with the button tag:</p>
<button type="button">Button</button>
</body>
</html>Listes HTML
Les listes HTML sont définies avec la balise <ul>, utilisée pour spécifier une liste non ordonnée, ou avec la balise <ol>, utilisée pour créer une liste ordonnée, suivie des balises <li>.
Exemple des listes HTML :
Exemple de listes HTML :
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h2>An unordered list</h2>
<ul>
<li>Pen</li>
<li>Pencil</li>
<li>Ruler</li>
<li>Book</li>
</ul>
<h2>An ordered list</h2>
<ol>
<li>Pen</li>
<li>Pencil</li>
<li>Ruler</li>
<li>Book</li>
</ol>
</body>
</html>Lignes horizontales HTML
La balise HTML <hr> sépare la page en différentes parties et crée une rupture thématique. C’est une balise vide.
Exemple de la balise HTML <hr> :
Exemple de la balise HTML <hr> :
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h1>Welcome to W3Docs</h1>
<hr />
<p>
Learn to design and build professional website<br />
Learn to design and build professional website
</p>
<p>Learn to design and build a professional website</p>
<hr />
<p>Learn to design and build professional website</p>
<p>Learn to design and build professional website</p>
<p>Learn to design and build professional website</p>
<hr />
</body>
</html>Practice
Which of the following is true about HTML based on the content at https://www.w3docs.com/learn-html/html-basic.html?