< et >. La/ en plus. Le HTMLbalise(contenu)]]><balise>contenu</balise>]]><img /> ou <br />.]]>{balise contenu}]]>[balise: contenu]]]><!DOCTYPE html> est la déclaration HTML5<html lang="fr">]]><html> (avec ou sanslang) vient après la<meta charset="utf-8">]]><head>,<!DOCTYPE html>]]><head>]]><head> vient à l'intérieur de<html>.]]><head> contient titre (<title>), encodage<meta charset="utf-8">), feuilles de style<link>), scripts (<script>). <body><!DOCTYPE html>
<html>
<head>...</head>
<body>...</body>
</html>]]><head> (méta-données :<body> (contenu<html>.]]><html>
<head>...</head>
<body>...</body>
</html>]]><!DOCTYPE html>, qui déclare le type de<!DOCTYPE html>
<head>...</head>
<body>...</body>]]><html>,<head> et <body>.]]><html>
<!DOCTYPE html>
<head>...</head>
<body>...</body>
</html>]]><!DOCTYPE html><html> ; placée à l'intérieur, elle<h1> à <h6>. Importante pour<h1> à <h3>).]]><head>]]><head> est la zone des<title1>]]><title>]]><title> est dans <head> et<h1>]]><h1> (heading level 1,<h6> (level 6).<h1> par page (le<p> est l'une des balises les plus utilisées.<br>.]]><para>]]><paragraph>]]><p>.]]><text>]]><p>]]><p> (paragraph). Lehttps://example.com ?]]>target="_blank" pour ouvrir dans un<a href="#section1">.]]><link href="https://example.com">texte</link>]]><link> est utilisée dans <head><href="https://example.com">texte</href>]]><href>. C'est un<url="https://example.com">texte</url>]]><url> non plus.]]><a href="https://example.com">texte</a>]]><a> (anchor) avechref (hypertext reference).alt est obligatoire pouralt,<image src="...">]]><img>. Piège : le parseur HTML<image> en<img>, l'image s'affiche donc quand même<picture src="...">]]><picture> existe (pour les images<source> et un<img>.]]><src="...">]]>src est un attribut, pas une<img src="..." alt="...">]]><img> avec src (chemin)alt (texte alternatif pour<li>.]]><ol>]]><ol> (ordered list) est une<list>]]><ul>]]><ul> (unordered list)<li> (list item).<bullet>]]><a href="page.html">lien</a>, qu'est-cehref ?]]>id, class, style,href, src, alt. La syntaxe est toujoursattribut="valeur" à l'intérieur de la balise<a>]]>href figure à l'intérieur de la<a>]]>nom="valeur" et complète l'information<div> et<span> ?]]>display: block; ou display: inline;.]]><div> est désormais totalement obsolète]]><div> est un conteneur de bloc, <span> un conteneur en ligne]]><div> est utilisé pour<span> pour<span> ne peut s'utiliser que dans l'en-tête <head>]]><span> s'utilise dans <body>,<meta charset="utf-8"> dans <head> ?]]><head> pour garantir un affichage correct<script>. La<meta charset><meta name="robots"
content="noindex">.]]>class et id ?]]>class pourid pour les ancres et lesclass est obsolète et remplacé par id en HTML5]]>class reste l'un des attributsid est unique, class peut viser plusieurs éléments]]>id identifie un seulid="header-principal"),class regroupe des éléments partageant unclass="bouton").]]>id ne fonctionne plus du tout en HTML5]]>id fonctionne parfaitement enid dans la page.]]><table>, <tr>, <td> et <th>]]><tr> (table row) pour les lignes,<td> (table data) pour les cellules et<th> (table header) pour les en-têtes<thead>,<tbody>, <tfoot> pour les groupements.]]><grid>, <row>, <cell>]]><table> toute seule, sans balises internes]]><tr> et <td> (ou<th>) pour avoir un contenu.]]><spreadsheet>, <line> et <column>]]><p> ne peut pas contenir de bloc<p>).]]><a href="x"><strong>texte</strong></a>]]><ul><li>élément</li></ul>]]><li> dans <ul>.]]><p>Voici un <strong>mot</strong> important.</p>]]><strong>)<p>).]]><p>Texte <p>imbriqué</p>.</p>]]><p> dans un autre<p>. Le navigateur fermera<area>, <base>,<br>, <col>, <embed>, <hr>, <img>,<input>, <link>, <meta>, <source>,<track>, <wbr>.]]><img>, <br>, <hr>, <meta>, <link>, <input>]]><br> ou <br />.]]><p>, <div>, <span>]]><title>, <script>, <style>]]><title>Mon site</title>).]]><head> et <body> du squelette]]><strong> vs <b> : la première a un sens<important>]]><text-bold>]]><bold>]]><strong>]]><strong> exprime<b> existe aussi mais est purement<em> (sémantique) ou <i>.]]>/site/index.html et l'image/site/img/photo.jpg, quel src utiliserimg/photo.jpg), absolu par rapport au/img/photo.jpg), absolu complethttps://...). Les chemins relatifs sont../img/photo.jpg]]>.. remonte d'un dossier, ici/img/photo.jpg.]]>https://./img/photo.jpg]]>img/photo.jpg]]>/ initial, c'est/site/index.html, img/photo.jpg/site/img/photo.jpg.]]>/img/photo.jpg]]><ul>
<li>Pomme</li>
<li>Banane</li>
<ol>
<li>Cerise</li>
</ol>
</ul><li> du parent.<ol> ne peut pas être un<ul>. Il devrait être<li>. Le rendu peut varier selon<ol> doit être imbriqué dans un <li>]]><ul><li>Banane<ol><li>Cerise</li></ol></li></ul>.<li> directement.]]><!DOCTYPE html>
<html>
<head></head>
<body></body>
</html><!DOCTYPE html><html lang="fr"><head><meta
charset="utf-8"><title>Titre</title></head>
<body></body></html>.]]><title> dans <head>]]><title> est obligatoire.lang sur <html>]]><html lang="fr">), mais<script>]]><style>]]><table> pour la mise en page d'une page web (en dehors de présenter<table>, mais avec <thead>, <tbody>, et<table> a été supprimée de HTML5]]><table> existe toujours, maisid = identifiant uniqueclass =<header>, <nav>, etc.) améliorent l'accessibilité et le SEO]]><head> et <body> dans <html>]]>id peut être utilisé pour plusieurs éléments dans la même page]]>id doit êtreclass.]]><head> d'une page HTML, à quoi sert<meta name="description" content="Cours de NSI en ligne"><head>, on regroupe toutes les informations<title><meta charset> (encodage),<meta name="description"> (résumé pour les<meta name="viewport"> (adaptation<title>, distincte de<meta name="description">.]]><meta name="robots" content="noindex">. La<head> est<iframe> àContent-Security-Policy.]]><iframe>]]><iframe> (cadre ensrc.]]><embed>]]><embed> insère plutôt des objets<include>]]><include> n'existe en<link>]]><link> sert à déclarer des<head>, et non à<div>, <p>, <h1>,<ul>, <section>...) prennent toute la largeur<span>, <a>, <strong>, <em>,<img>...) restent au sein de la ligne courante.display.]]><em>]]><em> (emphase, rendue<img>]]><img> est un élément en ligne :<h1>]]><h1> est un élément en bloc,<h1> à <h6>. Par<a>]]><a> est par défaut un<center>,<font>, <big>...) sont donc réellement<strong>]]><strong> est bien vivante.<section>]]><section> a au contraire été<center>]]><center> centrait letext-align: center; oumargin: auto;). Le standard HTML la<figure>]]><figure> est aussi une<figcaption>.]]>