Web 2017-02-16
De an
Sommaire
Les balises obligatoires
<html>
, <head>
, <body>
<!DOCTYPE html> <html> <head></head> <body></body> </html>
Les balises "meta"
-
<link>
- pour lier à une feuille de styles
-
<meta>
- ajouter diverse metadonnées
-
<script>
- pour lier à un script javascript
<head> <title>Mon titre</title> <meta charset="UTF-8" /> <script src="mon_script.js"></script> <link rel="stylesheet" href="ma_feuille_de_style.css"> </head>
Les balises pour compartimenter une page
Pour en savoir plus: https://www.alsacreations.com/article/lire/1376-html5-section-article-nav-header-footer-aside.html
-
<div>
- signifie 'diviser'. C'est la balise générique que l'on utilise pour ajouter de la structure lorsque qu'aucune autre balise n'est aappropriée.
-
<aside>
- contenu périphérique, par exemple un encart dans un article
-
<nav>
- contient la navigation principale
-
<section>
- pour créer des sections sur un site
-
<article>
- utilisé pour baliser un article complet (titre, intro, contenu, date de publication, etc.)
-
<header>
- utilisé pour grouper les informations d'entête
-
<footer>
- utilisé pour grouper les informations de pied de page (exemple: signature de l'auteur, etc.)
<body> <h1>Ma page</h1> <section class="last-articles"> <article>...</article> <article>...</article> <article>...</article> </section> <section class="most-popular"> <article>...</article> <article>...</article> <article>...</article> </section> </body>
Les balises pour structurer des niveaux d'information
-
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>
- titre, sous-titre, etc.
-
<p>
- paragraphe
-
<ol>
- liste ordonnée (exemple: table des matières)
-
<ul>
- liste non-ordonnée (exemple: liste d'ingrédients dans une recette)
-
<li>
- élément de liste
-
<img>
- balise image
-
<figure>
- balises figure
-
<figcaption>
- légende d'une figure
Les balises en ligne
-
<strong>
- contenu important, souvent traduit graphiquement par du gras
-
<em>
- emphase, souvent traduit graphiquement par de l'italique
-
<a>
- lien
-
<span>
- balise générique pour
Autre
-
<iframe>
- inclure une page dans une autre