Cliquez pour télécharger une liste de codes HTML imprimable.
Les personnes qui apprennent les bases de la conception Web peuvent souhaiter conserver une liste de codes HTML à portée de main pour référence et comprendre ce que les balises sont conçues pour accomplir. Connaître leur objectif vous aidera à créer une structure conviviale pour le référencement de votre site.
Codes HTML utilisés dans la conception Web
Lorsque vous apprenez à concevoir une page Web, c’est plus simple si vous comprenez le HTML de base, même si vous utilisez un éditeur ou un constructeur de site Web. Connaître les bases vous aidera à comprendre comment la page est lue par les navigateurs.
Si vous avez besoin d’aide pour télécharger la liste imprimable, consultez ces conseils utiles.
Toutes les pages Web ont ce code de base:
: Cette balise a été simplifiée en HTML5 depuis que les multiples déclarations ont été éliminées – ne laissant qu’une seule: html. En HTML 4.01, les déclarations incluent: strict, transitionnel, frameset et les déclarations XHTML 1.0 de strict, transitionnel, frameset et XHTML 1.1.
: Commence votre document
: Contient des informations sur la page telles que les balises META et le titre; ceci n’est pas rendu dans le navigateur Web
</strong>: Le titre de votre page – visible dans l’onglet du navigateur</p>
<p> <strong> : Se ferme </strong> marque</p>
<p> <strong><!-- Ezoic - wp_incontent_6 - incontent_6 --><div id="ezoic-pub-ad-placeholder-148" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_6 - incontent_6 --></HEAD></strong>: Se ferme <strong><HEAD></strong> marque</p>
<p> <strong><CORPS></strong>: Il s’agit de la zone de contenu de votre page Web – où vous allez inclure du texte, des images, des graphiques, etc.</p>
<p> Tout ce qui se trouve à l’intérieur de la balise <body> est visible dans le navigateur. À la fin de votre page HTML, vous devez fermer les balises ouvertes en utilisant:</p>
<p> <strong><!-- Ezoic - wp_incontent_7 - incontent_7 --><div id="ezoic-pub-ad-placeholder-149" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_7 - incontent_7 --></BODY></strong> pour fermer le <strong><CORPS></strong> étiquette et</p>
<p> <strong></HTML></strong> pour fermer le <strong><HTML></strong> marque.</p>
<h2><span id="Liste_des_balises_introduites_dans_HTML5"> Liste des balises introduites dans HTML5</span></h2>
<p> La plupart des balises introduites dans HTML5 sont conçues pour traiter du contenu qui n’était pas répandu lors de la création de HTML 4.01. Ces nouvelles balises traitent du contenu comme les médias ou les balises sont un meilleur moyen de définir la structure de la page. Voici les balises introduites dans HTML5.</p>
<ul>
<li><! DOCTYPE HTML> Définit le type de document – html est le seul type en HTML5 </li><!-- Ezoic - wp_incontent_8 - incontent_8 --><div id="ezoic-pub-ad-placeholder-150" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_8 - incontent_8 -->
<li>
<article> </article>
<p> Définit un article </li>
<li>
<aside> </aside>
<p> Définit une barre latérale – ou à côté – d’un article <!-- Ezoic - wp_incontent_9 - incontent_9 --><div id="ezoic-pub-ad-placeholder-151" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_9 - incontent_9 --></li>
<li><audio></audio> Désigne les fichiers audio </li>
<li><bdi> </bdi> Isole une partie du texte qui pourrait être formatée dans une direction différente de celle du texte en dehors. </li><!-- Ezoic - wp_incontent_10 - incontent_10 --><div id="ezoic-pub-ad-placeholder-152" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_10 - incontent_10 -->
<li><canvas> </canvas> C’est le conteneur qui contient tout langage de script utilisé pour dessiner des graphiques à la volée </li>
<li><command> </command> Définit un bouton de commande sur lequel les utilisateurs peuvent cliquer – dans un formulaire </li>
<li><datalist> </datalist> Utilisé dans un formulaire. Il désigne une liste d’options prédéfinies pour l’entrée </li><!-- Ezoic - wp_incontent_11 - incontent_11 --><div id="ezoic-pub-ad-placeholder-153" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_11 - incontent_11 -->
<li>
<details> </details>
<p> Définit les informations supplémentaires qu’un utilisateur peut afficher ou masquer </li>
<li><dialog> </dialog> Définit une boîte de dialogue ou une fenêtre. </li><!-- Ezoic - wp_incontent_12 - incontent_12 --><div id="ezoic-pub-ad-placeholder-154" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_12 - incontent_12 -->
<li> Ceci est un conteneur pour une application externe (non HTML) – comme une vidéo </li>
<li><figcaption><figcaption> La légende du contenu<br />
<figure> </li>
<li>
<figure> </figure>
<p> Spécifie un contenu autonome comme une image <!-- Ezoic - wp_incontent_13 - incontent_13 --><div id="ezoic-pub-ad-placeholder-155" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_13 - incontent_13 --></li>
<li>
<header> </header>
<p> Définit la partie d’en-tête du document ou une section à l’intérieur du document </li><!-- Ezoic - wp_incontent_14 - incontent_14 --><div id="ezoic-pub-ad-placeholder-156" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_14 - incontent_14 -->
<li><keygen> </keygen> Utilisé pour définir un champ de générateur de paires de clés dans les formulaires </li>
<li><mark> </mark> Définit le texte mis en surbrillance ou marqué </li>
<li><meter> </meter> Définit une mesure scalaire dans une plage connue (une jauge) – par exemple 2 sur 10 </li><!-- Ezoic - wp_incontent_15 - incontent_15 --><div id="ezoic-pub-ad-placeholder-157" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_15 - incontent_15 -->
<li>
<nav> </nav>
<p> Liens de navigation </li>
<li><output> </output> Spécifie la sortie du calcul </li><!-- Ezoic - wp_incontent_16 - incontent_16 --><div id="ezoic-pub-ad-placeholder-158" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_16 - incontent_16 -->
<li><progress> </progress> Représente la progression d’une tâche </li>
<li><rp> </rp> Définit les éléments à afficher dans les navigateurs qui ne prennent pas en charge les annotations ruby </li>
<li><rt> </rt> Définit une explication / prononciation des caractères (pour la typographie est-asiatique) </li><!-- Ezoic - wp_incontent_17 - incontent_17 --><div id="ezoic-pub-ad-placeholder-159" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_17 - incontent_17 -->
<li><ruby> </ruby> Définit une annotation ruby (pour la typographie est-asiatique) </li>
<li>
<section> </section>
<p> Définit une section spécifique à l’intérieur d’un document </li><!-- Ezoic - wp_incontent_18 - incontent_18 --><div id="ezoic-pub-ad-placeholder-160" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_18 - incontent_18 -->
<li><source></source> Définit plusieurs ressources multimédias pour les éléments multimédias tels que <video>ou <audio></li>
<li>
<summary> </summary>
<p> Définit un en-tête visible pour un élément </p>
<details> </li><!-- Ezoic - wp_incontent_19 - incontent_19 --><div id="ezoic-pub-ad-placeholder-161" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_19 - incontent_19 -->
<li><time> </time> Date et heure </li>
<li><track></track> Définit les pistes de texte pour les éléments multimédias tels que <video>ou <audio></li>
<li><video></video> Un film ou une vidéo </li><!-- Ezoic - wp_incontent_20 - incontent_20 --><div id="ezoic-pub-ad-placeholder-162" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_20 - incontent_20 -->
<li><wbr> </wbr> Définit un saut de ligne possible </li>
</ul>
<h2><span id="Liste_des_balises_HTML_401_non_prises_en_charge_dans_HTML5"> Liste des balises HTML 4.01 non prises en charge dans HTML5</span></h2>
<p> Une poignée de balises ont été supprimées dans HTML5 en raison de leur manque d’utilisation – ou parce qu’elles étaient utilisées d’une manière autre que leur utilisation prévue.</p>
<ul>
<li><acronym> <acronym> Définit un acronyme </li><!-- Ezoic - wp_incontent_21 - incontent_21 --><div id="ezoic-pub-ad-placeholder-163" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_21 - incontent_21 -->
<li><basefont> </basefont> Désigne la couleur, la taille et la police par défaut du texte du document </li>
<li><big> </big> Agrandit le texte </li>
<li><center> </center> Centre du texte </li><!-- Ezoic - wp_incontent_22 - incontent_22 --><div id="ezoic-pub-ad-placeholder-164" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_22 - incontent_22 -->
<li><dir> </dir> Liste des répertoires </li>
<li><font> </font> Utilisé pour définir la couleur, la taille et la police dans un document </li>
<li><frame> </frame> Définit un cadre à l’intérieur d’un jeu de cadres </li><!-- Ezoic - wp_incontent_23 - incontent_23 --><div id="ezoic-pub-ad-placeholder-165" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_23 - incontent_23 -->
<li><frameset> </frameset> Spécifie un ensemble de cadres </li>
<li><noframes> </noframes> Définit un contenu alternatif pour les utilisateurs qui ne prennent pas en charge les cadres </li>
<li><strike> </strike> Texte barré </li><!-- Ezoic - wp_incontent_24 - incontent_24 --><div id="ezoic-pub-ad-placeholder-166" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_24 - incontent_24 -->
<li><tt> </tt> Télétype du texte </li>
</ul>
<h2><span id="Liste_des_codes_HTML_compatibles_en_HTML_401_et_HTML5"> Liste des codes HTML compatibles en HTML 4.01 et HTML5</span></h2>
<p> Voici une liste de balises HTML 4.01 qui font également partie de la norme HTML5:</p>
<ul>
<li><! --...--> Définit un commentaire </li><!-- Ezoic - wp_incontent_25 - incontent_25 --><div id="ezoic-pub-ad-placeholder-167" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_25 - incontent_25 -->
<li><a> </a> Hyperlien </li>
<li><abbr> </abbr> Abréviation </li>
<li>
<address> </address>
<p> Définit les informations d’adresse du propriétaire du document <!-- Ezoic - wp_incontent_26 - incontent_26 --><div id="ezoic-pub-ad-placeholder-168" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_26 - incontent_26 --></li>
<li><applet> </applet> Définit une applet intégrée </li>
<li>
<area> </area>
<p> Définit une zone à l’intérieur d’une image-map <!-- Ezoic - wp_incontent_27 - incontent_27 --><div id="ezoic-pub-ad-placeholder-169" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_27 - incontent_27 --></li>
<li><base> </base> URL / cible de base pour toutes les URL relatives d’un document </li>
<li><bdo> </bdo> Remplace la direction actuelle du texte </li><!-- Ezoic - wp_incontent_28 - incontent_28 --><div id="ezoic-pub-ad-placeholder-170" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_28 - incontent_28 -->
<li>
<blockquote></blockquote>
<p> Section citée d’une autre source </li>
<li><body> </body> Définit le corps du document </li><!-- Ezoic - wp_incontent_29 - incontent_29 --><div id="ezoic-pub-ad-placeholder-171" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_29 - incontent_29 -->
<li> Saut de ligne </li>
<li><button> </button> Définit un bouton cliquable </li>
<li>
<caption> </caption>
<p> Définit la légende d’un tableau <!-- Ezoic - wp_incontent_30 - incontent_30 --><div id="ezoic-pub-ad-placeholder-172" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_30 - incontent_30 --></li>
<li><cite> </cite> Titre d’une œuvre </li>
<li><code> </code> Codage informatique </li><!-- Ezoic - wp_incontent_31 - incontent_31 --><div id="ezoic-pub-ad-placeholder-173" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_31 - incontent_31 -->
<li>
<col> </col>
<p> Colonnes dans un tableau </li>
<li>
<colgroup> </colgroup>
<p> Groupe d’une ou plusieurs colonnes dans un tableau <!-- Ezoic - wp_incontent_32 - incontent_32 --><div id="ezoic-pub-ad-placeholder-174" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_32 - incontent_32 --></li>
<li>
<dd> </dd>
<p> Description de la définition </li><!-- Ezoic - wp_incontent_33 - incontent_33 --><div id="ezoic-pub-ad-placeholder-175" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_33 - incontent_33 -->
<li><del> </del> Texte supprimé du document </li>
<li><dfn> </dfn> Terme de définition </li>
<li>
<dl> </dl>
<p> Liste de définitions <!-- Ezoic - wp_incontent_34 - incontent_34 --><div id="ezoic-pub-ad-placeholder-176" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_34 - incontent_34 --></li>
<li>
<div> </div>
<p> Section dans un document </li><!-- Ezoic - wp_incontent_35 - incontent_35 --><div id="ezoic-pub-ad-placeholder-177" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_35 - incontent_35 -->
<li>
<dt>
<dt> Terme de définition </li>
<li><em> </em> Emphase </li>
<li> Incorporer un élément </li><!-- Ezoic - wp_incontent_36 - incontent_36 --><div id="ezoic-pub-ad-placeholder-178" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_36 - incontent_36 -->
<li>
<fieldset> </fieldset>
<p> Regroupe les éléments associés dans un formulaire </li>
<li>
<form> <closeform></closeform></form>
<p> Formulaire <!-- Ezoic - wp_incontent_37 - incontent_37 --><div id="ezoic-pub-ad-placeholder-179" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_37 - incontent_37 --></li>
<li><a name=""> </a> ancre </li>
<li>
<h1><span id="i"> </span></h1>
<p> Titre 1; utilisez 2, 3, 4, etc. pour différentes tailles <!-- Ezoic - wp_incontent_38 - incontent_38 --><div id="ezoic-pub-ad-placeholder-180" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_38 - incontent_38 --></li>
<li>
<hr>
<p> Règle horizontale </li><!-- Ezoic - wp_incontent_39 - incontent_39 --><div id="ezoic-pub-ad-placeholder-181" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_39 - incontent_39 -->
<li><i> </i> Italiques </li>
<li><img src = ""> Image </li>
<li>
<ol> </ol>
<p> Liste ordonnée <!-- Ezoic - wp_incontent_40 - incontent_40 --><div id="ezoic-pub-ad-placeholder-182" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_40 - incontent_40 --></li>
<li>
<ul> </ul>
<p> Liste non ordonnée </li><!-- Ezoic - wp_incontent_41 - incontent_41 --><div id="ezoic-pub-ad-placeholder-183" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_41 - incontent_41 -->
<li>
<li> </li>
<p> Élément de liste </li><!-- Ezoic - wp_incontent_42 - incontent_42 --><div id="ezoic-pub-ad-placeholder-184" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_42 - incontent_42 -->
<li><marquee> </marquee> Texte défilant </li>
<li><meta> Utilisé pour spécifier la description de la page, les mots clés, l’auteur et d’autres informations pertinentes sur la page </li>
<li>
<p> Paragraphe <!-- Ezoic - wp_incontent_43 - incontent_43 --><div id="ezoic-pub-ad-placeholder-185" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_43 - incontent_43 --></li>
<li><small> </small> Réduit le texte </li>
<li>
<table> </table>
<p> Tableau <!-- Ezoic - wp_incontent_44 - incontent_44 --><div id="ezoic-pub-ad-placeholder-186" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_44 - incontent_44 --></li>
</ul>
<h2><span id="Extraits_utiles"> Extraits <html> utiles</span></h2>
<p> L’une des balises HTML les plus couramment utilisées est probablement </p>
<table>. La plupart des tableaux utilisent trois balises principales: une pour le conteneur, une pour les informations à l’intérieur de la table et une pour désigner une ligne à l’intérieur de la table.</p>
<h3><span id="Tableau_HTML"> Tableau HTML</span></h3>
<p> Pour créer un tableau avec deux lignes et deux colonnes, vous utilisez les trois balises. Bien que vous puissiez styliser depuis l’intérieur de la balise, par exemple, </p><!-- Ezoic - wp_incontent_45 - incontent_45 --><div id="ezoic-pub-ad-placeholder-187" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_45 - incontent_45 -->
<table border = "1">, la méthode préférée est de contrôler l’apparence avec CSS.</p>
<p><table></p>
<tr></p>
<td> Ceci est la première case de la ligne 1 </td>
<p></p>
<td> Ceci est la deuxième case de la ligne 1 </td>
<p><!-- Ezoic - wp_incontent_46 - incontent_46 --><div id="ezoic-pub-ad-placeholder-188" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_46 - incontent_46 --></ tr></p>
<tr></p>
<td> Ceci est la première case de la ligne 2 </td>
<p></p>
<td> Ceci est la deuxième case de la ligne 2 </td>
<p></ tr><br /></ table></p>
<p> La même table avec une colonne d’en-tête qui s’étend sur les deux colonnes ressemblerait à ceci.</p><!-- Ezoic - wp_incontent_47 - incontent_47 --><div id="ezoic-pub-ad-placeholder-189" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_47 - incontent_47 -->
<p><table></p>
<tr></p>
<th colspan = "2"> Cette ligne s’étend sur les deux lignes en dessous. </th>
<p> Le </p>
<th> – en-tête du tableau – met en gras et centre le texte.<br /></tr>
<p></p><!-- Ezoic - wp_incontent_48 - incontent_48 --><div id="ezoic-pub-ad-placeholder-190" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_48 - incontent_48 -->
<tr></p>
<td> Ceci est la première case de la ligne 1 </td>
<p></p>
<td> Ceci est la deuxième case de la ligne 1 </td>
<p></ tr></p>
<tr></p>
<td> Ceci est la première case de la ligne 2 </td>
<p></p><!-- Ezoic - wp_incontent_49 - incontent_49 --><div id="ezoic-pub-ad-placeholder-191" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_49 - incontent_49 -->
<td> Ceci est la deuxième case de la ligne 2 </td>
<p></ tr><br /></table>
</p>
<h3><span id="Liste_de_choses_a_faire"> Liste de choses à faire</span></h3>
<p> En tirant parti du stockage local, la dernière version de Google Chrome et d’autres navigateurs, vous permet de créer une liste qui peut être modifiée à partir du navigateur de l’utilisateur. Pour le configurer, vous devez associer l’attribut <em>contenteditable</em> avec la liste.</p>
<p><h2><span id="Ma_liste_modifiable"> Ma liste modifiable </span></h2>
<p></p><!-- Ezoic - wp_incontent_50 - incontent_50 --><div id="ezoic-pub-ad-placeholder-192" data-inserter-version="2"></div><!-- End Ezoic - wp_incontent_50 - incontent_50 -->
<ul contenteditable = "true"></p>
<li> Aller à l’épicerie </li>
<p></p>
<li> Déposer les documents au bureau </li>
<p></p>
<li> Terminer les courses </li>
<p></ul>
</p><div class='jnews_inline_related_post_wrapper left'>
<div class='jnews_inline_related_post'>
<div class="jeg_postblock_21 jeg_postblock jeg_module_hook jeg_pagination_nextprev jeg_col_2o3 jnews_module_40181_1_68060ae337b78 " data-unique="jnews_module_40181_1_68060ae337b78">
<div class="jeg_block_heading jeg_block_heading_6 jeg_subcat_right">
<h3 class="jeg_block_title"><span id="ArticlesA_lire"><span>Articles<strong>A lire</strong></span></span></h3>
</div>
<div class="jeg_block_container">
<div class="jeg_posts jeg_load_more_flag"><article class="jeg_post jeg_pl_sm format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/ou-puis-je-trouver-des-arriere-plans-de-vacances-gratuits/" aria-label="Read article: Où puis-je trouver des arrière-plans de vacances gratuits"><div class="thumbnail-container animate-lazy size-715 "><img width="120" height="86" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-120x86 size-jnews-120x86 lazyload wp-post-image" alt="Holiday Background" data-src="https://supportivy.com/wp-content/uploads/2020/11/Ou-puis-je-trouver-des-arriere-plans-de-vacances-gratuits-120x86.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title"><span id="Ou_puis-je_trouver_des_arriere-plans_de_vacances_gratuits">
<a href="https://supportivy.com/ou-puis-je-trouver-des-arriere-plans-de-vacances-gratuits/">Où puis-je trouver des arrière-plans de vacances gratuits</a>
</span></h3>
<div class="jeg_post_meta"></div>
</div>
</article><article class="jeg_post jeg_pl_sm format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/livres-dor-gratuits-pour-sites-web-supportivy/" aria-label="Read article: Livres d’or gratuits pour sites Web | Supportivy"><div class="thumbnail-container animate-lazy size-715 "><img width="120" height="86" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-120x86 size-jnews-120x86 lazyload wp-post-image" alt="Free Guestbooks for Websites" data-src="https://supportivy.com/wp-content/uploads/2020/11/Livres-dor-gratuits-pour-sites-Web-Supportivy-120x86.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title"><span id="Livres_drsquoor_gratuits_pour_sites_Web__Supportivy">
<a href="https://supportivy.com/livres-dor-gratuits-pour-sites-web-supportivy/">Livres d’or gratuits pour sites Web | Supportivy</a>
</span></h3>
<div class="jeg_post_meta"></div>
</div>
</article><article class="jeg_post jeg_pl_sm format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/modeles-de-pages-web-de-genealogie-gratuits/" aria-label="Read article: Modèles de pages Web de généalogie gratuits"><div class="thumbnail-container animate-lazy size-715 "><img width="120" height="86" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-120x86 size-jnews-120x86 lazyload wp-post-image" alt="Free Genealogy Web Templates" data-src="https://supportivy.com/wp-content/uploads/2020/11/Modeles-de-pages-Web-de-genealogie-gratuits-120x86.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title"><span id="Modeles_de_pages_Web_de_genealogie_gratuits">
<a href="https://supportivy.com/modeles-de-pages-web-de-genealogie-gratuits/">Modèles de pages Web de généalogie gratuits</a>
</span></h3>
<div class="jeg_post_meta"></div>
</div>
</article><article class="jeg_post jeg_pl_sm format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/modeles-gratuits-de-dreamweaver-supportivy/" aria-label="Read article: Modèles gratuits de Dreamweaver | Supportivy"><div class="thumbnail-container animate-lazy size-715 "><img width="120" height="86" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-120x86 size-jnews-120x86 lazyload wp-post-image" alt="Cascading Style Sheets" data-src="https://supportivy.com/wp-content/uploads/2020/11/Modeles-gratuits-de-Dreamweaver-Supportivy-120x86.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title"><span id="Modeles_gratuits_de_Dreamweaver__Supportivy">
<a href="https://supportivy.com/modeles-gratuits-de-dreamweaver-supportivy/">Modèles gratuits de Dreamweaver | Supportivy</a>
</span></h3>
<div class="jeg_post_meta"></div>
</div>
</article></div>
<div class='module-overlay'>
<div class='preloader_type preloader_dot'>
<div class="module-preloader jeg_preloader dot">
<span></span><span></span><span></span>
</div>
<div class="module-preloader jeg_preloader circle">
<div class="jnews_preloader_circle_outer">
<div class="jnews_preloader_circle_inner"></div>
</div>
</div>
<div class="module-preloader jeg_preloader square">
<div class="jeg_square">
<div class="jeg_square_inner"></div>
</div>
</div>
</div>
</div>
</div>
<div class="jeg_block_navigation">
<div class='navigation_overlay'><div class='module-preloader jeg_preloader'><span></span><span></span><span></span></div></div>
<div class="jeg_block_nav ">
<a href="#" aria-label="View previous page posts" class="prev disabled" title="Previous"><i class="fa fa-angle-left"></i></a>
<a href="#" aria-label="View next page posts" class="next " title="Next"><i class="fa fa-angle-right"></i></a>
</div>
</div>
<script>var jnews_module_40181_1_68060ae337b78 = {"header_icon":"","first_title":"Articles","second_title":"A lire","url":"","header_type":"heading_6","header_background":"","header_secondary_background":"","header_text_color":"","header_line_color":"","header_accent_color":"","header_filter_category":"","header_filter_author":"","header_filter_tag":"","header_filter_text":"All","sticky_post":false,"post_type":"post","content_type":"all","sponsor":false,"number_post":"4","post_offset":0,"unique_content":"disable","include_post":"","included_only":false,"exclude_post":40181,"include_category":"1265","exclude_category":"","include_author":"","include_tag":"","exclude_tag":"","sort_by":"latest","date_format":"default","date_format_custom":"Y\/m\/d","force_normal_image_load":"","pagination_mode":"nextprev","pagination_nextprev_showtext":"","pagination_number_post":"4","pagination_scroll_limit":0,"boxed":"","boxed_shadow":"","el_id":"","el_class":"","scheme":"","column_width":"auto","title_color":"","accent_color":"","alt_color":"","excerpt_color":"","css":"","paged":1,"column_class":"jeg_col_2o3","class":"jnews_block_21"};</script>
</div>
</div>
</div><div class="jeg_ad jeg_ad_article jnews_content_inline_ads "><div class='ads-wrapper align-center '><div class='ads_code'><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- supportivy 2 -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-1214369961715307"
data-ad-slot="5769368363"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script></div></div></div>
<p> Lorsque les utilisateurs accèdent au codage ci-dessus à partir de nouveaux navigateurs (et non d’Internet Explorer), ils peuvent éditer et changer la liste à leur guise.</p>
<h2><span id="Comment_le_CSS_interagit_avec_le_HTML"> Comment le CSS interagit avec le HTML</span></h2>
<p> Le HTML est un langage de balisage et son rôle est de structurer la page. Étant donné que le langage de balisage est lu de haut en bas par le navigateur, les informations les plus importantes doivent être en haut de la page – et être enveloppées dans la balise appropriée. Le titre du haut doit toujours être une balise – généralement un</p>
<h2><span id="_les_paragraphes_vont_a_lrsquointerieur"> , les paragraphes vont à l’intérieur</span></h2>
<p> , etc. de cette façon, le navigateur (et les moteurs de recherche) peuvent valider la hiérarchie d’importance pour le texte de la page.</p>
<p> Étant donné que HTML ne doit être utilisé que pour la structure d’un document, CSS est utilisé pour la conception et l’aspect. Bien que certaines balises HTML puissent avoir un style minimal sans CSS, la meilleure pratique consiste à contrôler la conception de votre site avec CSS. CSS fonctionne en créant des noms pour les différents types de contenu sur votre page. Lorsque le navigateur lit un «nom» CSS – il applique le style – associé à ce nom – au contenu.</p>
<h2><span id="Vous_ne_vous_souvenez_pas_de_toutes_les_balises"> Vous ne vous souvenez pas de toutes les balises?</span></h2>
<p> La bonne chose est que vous n’en avez pas besoin – vous pouvez utiliser une liste de références comme celle-ci pour vérifier à quoi sert une balise – ou utiliser un éditeur HTML avec une référence intégrée comme HTML-Kit. Ce qui est plus important que de mémoriser toutes les balises, c’est de concevoir des pages en pensant aux navigateurs actuels et futurs. En faisant cela, lorsque les utilisateurs rattraperont et installeront le navigateur le plus récent, les nouvelles balises seront déjà en place – et fonctionneront comme prévu.</p>
<p>Lisez plus d’astuces sur <a href=""https://supportivy.com/category/web-design/"> le design web ici</a>, et n’oubliez pas de partager l’article sur Facebook !</p>
</div>
</div>
<div class="jeg_share_bottom_container"><div class="jeg_share_button share-bottom clearfix">
<div class="jeg_sharelist">
<a href="http://www.facebook.com/sharer.php?u=https%3A%2F%2Fsupportivy.com%2Fliste-des-codes-html-supportivy%2F" rel='nofollow' class="jeg_btn-facebook expanded"><i class="fa fa-facebook-official"></i><span>Share</span></a><a href="https://twitter.com/intent/tweet?text=Liste%20des%20codes%20HTML%20%7C%20%20Supportivy&url=https%3A%2F%2Fsupportivy.com%2Fliste-des-codes-html-supportivy%2F" rel='nofollow' class="jeg_btn-twitter expanded"><i class="fa fa-twitter"><svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg></i><span>Tweet</span></a><a href="https://www.pinterest.com/pin/create/bookmarklet/?pinFave=1&url=https%3A%2F%2Fsupportivy.com%2Fliste-des-codes-html-supportivy%2F&media=https://supportivy.com/wp-content/uploads/2020/10/Liste-des-codes-HTML-Supportivy.jpg&description=Liste%20des%20codes%20HTML%20%7C%20%20Supportivy" rel='nofollow' class="jeg_btn-pinterest expanded"><i class="fa fa-pinterest"></i><span>Pin</span></a>
<div class="share-secondary">
<a href="https://www.linkedin.com/shareArticle?url=https%3A%2F%2Fsupportivy.com%2Fliste-des-codes-html-supportivy%2F&title=Liste%20des%20codes%20HTML%20%7C%20%20Supportivy" rel='nofollow' class="jeg_btn-linkedin "><i class="fa fa-linkedin"></i></a>
</div>
<a href="#" class="jeg_btn-toggle"><i class="fa fa-share"></i></a>
</div>
</div></div>
<div class="jeg_ad jeg_article jnews_content_bottom_ads "><div class='ads-wrapper '><div class='ads_code'><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- supportivy 3 -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-1214369961715307"
data-ad-slot="8203960011"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script></div></div></div><div class="jnews_prev_next_container"></div><div class="jnews_author_box_container "></div><div class="jnews_related_post_container"><div class="jeg_postblock_23 jeg_postblock jeg_module_hook jeg_pagination_disable jeg_col_2o3 jnews_module_40181_2_68060ae342f4a " data-unique="jnews_module_40181_2_68060ae342f4a">
<div class="jeg_block_heading jeg_block_heading_8 jeg_subcat_right">
<h3 class="jeg_block_title"><span>Related<strong> Posts</strong></span></h3>
</div>
<div class="jeg_block_container">
<div class="jeg_posts_wrap">
<div class="jeg_posts jeg_load_more_flag">
<article class="jeg_post jeg_pl_md_1 format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/ou-puis-je-trouver-des-arriere-plans-de-vacances-gratuits/" aria-label="Read article: Où puis-je trouver des arrière-plans de vacances gratuits"><div class="thumbnail-container animate-lazy size-715 "><img width="278" height="250" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-350x250 size-jnews-350x250 lazyload wp-post-image" alt="Holiday Background" decoding="async" data-src="https://supportivy.com/wp-content/uploads/2020/11/Ou-puis-je-trouver-des-arriere-plans-de-vacances-gratuits-278x250.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
<div class="jeg_post_category">
<span><a href="https://supportivy.com/category/web-design/" class="category-web-design">Web Design</a></span>
</div>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title">
<a href="https://supportivy.com/ou-puis-je-trouver-des-arriere-plans-de-vacances-gratuits/">Où puis-je trouver des arrière-plans de vacances gratuits</a>
</h3>
<div class="jeg_post_excerpt">
<p>Fond d'écran GIF animé gratuit De nombreuses personnes qui souhaitent créer des pages Web saisonnières, mais qui n'ont pas beaucoup...</p>
</div>
<div class="jeg_post_meta"></div>
</div>
</article><article class="jeg_post jeg_pl_md_1 format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/livres-dor-gratuits-pour-sites-web-supportivy/" aria-label="Read article: Livres d’or gratuits pour sites Web | Supportivy"><div class="thumbnail-container animate-lazy size-715 "><img width="300" height="163" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-350x250 size-jnews-350x250 lazyload wp-post-image" alt="Free Guestbooks for Websites" decoding="async" data-src="https://supportivy.com/wp-content/uploads/2020/11/Livres-dor-gratuits-pour-sites-Web-Supportivy.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
<div class="jeg_post_category">
<span><a href="https://supportivy.com/category/web-design/" class="category-web-design">Web Design</a></span>
</div>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title">
<a href="https://supportivy.com/livres-dor-gratuits-pour-sites-web-supportivy/">Livres d’or gratuits pour sites Web | Supportivy</a>
</h3>
<div class="jeg_post_excerpt">
<p>Livre d'or des codes HTML Les livres d'or gratuits pour les sites Web sont l'un des artefacts les plus durables...</p>
</div>
<div class="jeg_post_meta"></div>
</div>
</article><article class="jeg_post jeg_pl_md_1 format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/modeles-de-pages-web-de-genealogie-gratuits/" aria-label="Read article: Modèles de pages Web de généalogie gratuits"><div class="thumbnail-container animate-lazy size-715 "><img width="292" height="250" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-350x250 size-jnews-350x250 lazyload wp-post-image" alt="Free Genealogy Web Templates" decoding="async" loading="lazy" data-src="https://supportivy.com/wp-content/uploads/2020/11/Modeles-de-pages-Web-de-genealogie-gratuits-292x250.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
<div class="jeg_post_category">
<span><a href="https://supportivy.com/category/web-design/" class="category-web-design">Web Design</a></span>
</div>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title">
<a href="https://supportivy.com/modeles-de-pages-web-de-genealogie-gratuits/">Modèles de pages Web de généalogie gratuits</a>
</h3>
<div class="jeg_post_excerpt">
<p>Retrouver l'histoire de votre famille et localiser les détails sur les ancêtres peut prendre du temps. Une fois que tout...</p>
</div>
<div class="jeg_post_meta"></div>
</div>
</article><article class="jeg_post jeg_pl_md_1 format-standard">
<div class="jeg_thumb">
<a href="https://supportivy.com/modeles-gratuits-de-dreamweaver-supportivy/" aria-label="Read article: Modèles gratuits de Dreamweaver | Supportivy"><div class="thumbnail-container animate-lazy size-715 "><img width="300" height="225" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-350x250 size-jnews-350x250 lazyload wp-post-image" alt="Cascading Style Sheets" decoding="async" loading="lazy" data-src="https://supportivy.com/wp-content/uploads/2020/11/Modeles-gratuits-de-Dreamweaver-Supportivy.jpg" data-srcset="" data-sizes="auto" data-expand="700" /></div></a>
<div class="jeg_post_category">
<span><a href="https://supportivy.com/category/web-design/" class="category-web-design">Web Design</a></span>
</div>
</div>
<div class="jeg_postblock_content">
<h3 class="jeg_post_title">
<a href="https://supportivy.com/modeles-gratuits-de-dreamweaver-supportivy/">Modèles gratuits de Dreamweaver | Supportivy</a>
</h3>
<div class="jeg_post_excerpt">
<p>Il n'y a pas de quoi avoir honte à l'aide de modèles Dreamweaver gratuits. Dreamweaver est un programme détaillé qui...</p>
</div>
<div class="jeg_post_meta"></div>
</div>
</article>
</div>
</div>
<div class='module-overlay'>
<div class='preloader_type preloader_dot'>
<div class="module-preloader jeg_preloader dot">
<span></span><span></span><span></span>
</div>
<div class="module-preloader jeg_preloader circle">
<div class="jnews_preloader_circle_outer">
<div class="jnews_preloader_circle_inner"></div>
</div>
</div>
<div class="module-preloader jeg_preloader square">
<div class="jeg_square">
<div class="jeg_square_inner"></div>
</div>
</div>
</div>
</div>
</div>
<div class="jeg_block_navigation">
<div class='navigation_overlay'><div class='module-preloader jeg_preloader'><span></span><span></span><span></span></div></div>
</div>
<script>var jnews_module_40181_2_68060ae342f4a = {"header_icon":"","first_title":"Related","second_title":" Posts","url":"","header_type":"heading_8","header_background":"","header_secondary_background":"","header_text_color":"","header_line_color":"","header_accent_color":"","header_filter_category":"","header_filter_author":"","header_filter_tag":"","header_filter_text":"All","sticky_post":false,"post_type":"post","content_type":"all","sponsor":false,"number_post":"4","post_offset":0,"unique_content":"disable","include_post":"","included_only":false,"exclude_post":40181,"include_category":"1265","exclude_category":"","include_author":"","include_tag":"","exclude_tag":"","sort_by":"latest","date_format":"default","date_format_custom":"Y\/m\/d","excerpt_length":"20","excerpt_ellipsis":"...","force_normal_image_load":"","pagination_mode":"disable","pagination_nextprev_showtext":"","pagination_number_post":"4","pagination_scroll_limit":3,"boxed":"","boxed_shadow":"","el_id":"","el_class":"","scheme":"","column_width":"auto","title_color":"","accent_color":"","alt_color":"","excerpt_color":"","css":"","paged":1,"column_class":"jeg_col_2o3","class":"jnews_block_23"};</script>
</div></div><div class="jnews_popup_post_container"> <section class="jeg_popup_post">
<span class="caption">Next Post</span>
<div class="jeg_popup_content">
<div class="jeg_thumb">
<a href="https://supportivy.com/probleme-de-messagerie-privee-twitter-et-comment-le-resoudre-augmenter/">
<div class="thumbnail-container animate-lazy size-1000 "><img width="75" height="75" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-75x75 size-jnews-75x75 lazyload wp-post-image" alt="Problème de messagerie privée Twitter et comment le résoudre - augmenter" decoding="async" loading="lazy" sizes="auto, (max-width: 75px) 100vw, 75px" data-src="https://supportivy.com/wp-content/uploads/2020/10/Probleme-de-messagerie-privee-Twitter-et-comment-le-resoudre-75x75.png" data-srcset="https://supportivy.com/wp-content/uploads/2020/10/Probleme-de-messagerie-privee-Twitter-et-comment-le-resoudre-75x75.png 75w, https://supportivy.com/wp-content/uploads/2020/10/Probleme-de-messagerie-privee-Twitter-et-comment-le-resoudre-150x150.png 150w" data-sizes="auto" data-expand="700" /></div> </a>
</div>
<h3 class="post-title">
<a href="https://supportivy.com/probleme-de-messagerie-privee-twitter-et-comment-le-resoudre-augmenter/">
Problème de messagerie privée Twitter et comment le résoudre - augmenter </a>
</h3>
</div>
<div class="jeg_popup_content">
<div class="jeg_thumb">
<a href="https://supportivy.com/quel-est-le-meilleur-programme-pour-creer-des-applications-android-les-versions-sur-le-site-augmentation/">
<div class="thumbnail-container animate-lazy size-1000 "><img width="75" height="75" src="https://supportivy.com/wp-content/themes/jnews/assets/img/jeg-empty.png" class="attachment-jnews-75x75 size-jnews-75x75 lazyload wp-post-image" alt="Quel est le meilleur programme pour créer des applications Android? Les versions sur le site - Augmentation" decoding="async" loading="lazy" sizes="auto, (max-width: 75px) 100vw, 75px" data-src="https://supportivy.com/wp-content/uploads/2020/10/Quel-est-le-meilleur-programme-pour-creer-des-applications-Android-75x75.jpg" data-srcset="https://supportivy.com/wp-content/uploads/2020/10/Quel-est-le-meilleur-programme-pour-creer-des-applications-Android-75x75.jpg 75w, https://supportivy.com/wp-content/uploads/2020/10/Quel-est-le-meilleur-programme-pour-creer-des-applications-Android-150x150.jpg 150w" data-sizes="auto" data-expand="700" /></div> </a>
</div>
<h3 class="post-title">
<a href="https://supportivy.com/quel-est-le-meilleur-programme-pour-creer-des-applications-android-les-versions-sur-le-site-augmentation/">
Quel est le meilleur programme pour créer des applications Android? Les versions sur le site - Augmentation </a>
</h3>
</div>
<a href="#" class="jeg_popup_close"><i class="fa fa-close"></i></a>
</section>
</div><div class="jnews_comment_container"> <div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">Laisser un commentaire <small><a rel="nofollow" id="cancel-comment-reply-link" href="/liste-des-codes-html-supportivy/#respond" style="display:none;">Annuler la réponse</a></small></h3><form action="https://supportivy.com/wp-comments-post.php" method="post" id="commentform" class="comment-form"><p class="comment-notes"><span id="email-notes">Votre adresse e-mail ne sera pas publiée.</span> <span class="required-field-message">Les champs obligatoires sont indiqués avec <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Commentaire <span class="required">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required="required"></textarea></p><p class="comment-form-author"><label for="author">Nom <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required="required" /></p>
<p class="comment-form-email"><label for="email">E-mail <span class="required">*</span></label> <input id="email" name="email" type="text" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required="required" /></p>
<p class="comment-form-url"><label for="url">Site web</label> <input id="url" name="url" type="text" value="" size="30" maxlength="200" autocomplete="url" /></p>
<p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Enregistrer mon nom, mon e-mail et mon site dans le navigateur pour mon prochain commentaire.</label></p>
<p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Laisser un commentaire" /> <input type='hidden' name='comment_post_ID' value='40181' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
</p><closeform></closeform></form> </div><!-- #respond -->
</div> </div>
</div>
</div>
<div class="jeg_ad jeg_article jnews_article_bottom_ads">
<div class='ads-wrapper '></div> </div>
</div>
</div>
</div>
</div>
<div id="post-body-class" class="post-template-default single single-post postid-40181 single-format-standard wp-embed-responsive jeg_toggle_light jeg_single_tpl_3 jeg_single_fullwidth jeg_single_narrow jnews jsc_normal wpb-js-composer js-comp-ver-7.0 vc_responsive"></div>
</div>
<div class="post-ajax-overlay">
<div class="preloader_type preloader_dot">
<div class="newsfeed_preloader jeg_preloader dot">
<span></span><span></span><span></span>
</div>
<div class="newsfeed_preloader jeg_preloader circle">
<div class="jnews_preloader_circle_outer">
<div class="jnews_preloader_circle_inner"></div>
</div>
</div>
<div class="newsfeed_preloader jeg_preloader square">
<div class="jeg_square"><div class="jeg_square_inner"></div></div>
</div>
</div>
</div>
</div>
<div class="footer-holder" id="footer" data-id="footer">
<div class="jeg_footer jeg_footer_4 dark">
<div class="jeg_footer_container jeg_container">
<div class="jeg_footer_content">
<div class="container">
<div class="row">
<div class="jeg_footer_primary clearfix">
<div class="col-md-9 footer_column">
<ul class="jeg_menu_footer"><li id="menu-item-156" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-156"><a href="https://supportivy.com/">Accueil</a></li>
<li id="menu-item-42589" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-42589"><a href="https://supportivy.com/category/questions-reponses/">Questions & Réponses</a></li>
<li id="menu-item-157" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-157"><a href="https://supportivy.com/category/science/">Science</a></li>
<li id="menu-item-204596" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-204596"><a href="https://supportivy.com/category/astuces/">Astuces</a></li>
<li id="menu-item-158" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-158"><a href="https://supportivy.com/category/business/">Business</a></li>
<li id="menu-item-159" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-159"><a href="https://supportivy.com/category/cryptomonnaie/">Cryptomonnaie</a></li>
<li id="menu-item-160" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-160"><a href="https://supportivy.com/category/design-graphique/">Design</a></li>
<li id="menu-item-161" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-161"><a href="https://supportivy.com/category/marketing/">Marketing</a></li>
<li id="menu-item-162" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-162"><a href="https://supportivy.com/category/programmation/">Programmation</a></li>
<li id="menu-item-38265" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-privacy-policy menu-item-38265"><a rel="privacy-policy" href="https://supportivy.com/politique-de-confidentialite/">Politique de confidentialité</a></li>
<li id="menu-item-38263" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-38263"><a href="https://supportivy.com/a-propos/">A propos</a></li>
<li id="menu-item-38264" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-38264"><a href="https://supportivy.com/contact/">Contact</a></li>
</ul> </div>
<div class="col-md-3 footer_column footer_right">
<div class="footer-text">
</div>
</div>
</div>
<div class="jeg_footer_secondary clearfix">
<div class="col-md-9 footer_column">
<p class="copyright"> © 2018-2020 <a href="https://supportivy.com/" title="Supportivy Magazine">SupportIVY</a> - Premium Magazine. </p>
</div>
<div class="col-md-3 footer_column footer_right">
<div class="jeg_social_icon_block socials_widget nobg">
<a href="https://www.facebook.com/SupportIvy-2034071233571517" target='_blank' rel='external noopener nofollow' aria-label="Find us on Facebook" class="jeg_facebook"><i class="fa fa-facebook"></i> </a><a href="https://www.pinterest.com/supportivy/_saved/" target='_blank' rel='external noopener nofollow' aria-label="Find us on Pinterest" class="jeg_pinterest"><i class="fa fa-pinterest"></i> </a> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div><!-- /.footer --> </div>
<div class="jscroll-to-top desktop">
<a href="#back-to-top" class="jscroll-to-top_link"><i class="fa fa-angle-up"></i></a>
</div>
</div>
<script type="text/javascript">var jfla = []</script> <script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date()
a = s.createElement(o),
m = s.getElementsByTagName(o)[0]
a.async = 1
a.src = g
m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga')
ga('create', 'UA-133175614-2', 'auto')
ga('send', 'pageview')
</script>
<div id="selectShareContainer">
<div class="selectShare-inner">
<div class="select_share jeg_share_button">
<button class="select-share-button jeg_btn-facebook" data-url="http://www.facebook.com/sharer.php?u=[url]"e=[selected_text]" data-post-url="https%3A%2F%2Fsupportivy.com%2Fliste-des-codes-html-supportivy%2F" data-image-url="" data-title="Liste%20des%20codes%20HTML%20%7C%20%20Supportivy" ><i class="fa fa-facebook-official"></i></a><button class="select-share-button jeg_btn-twitter" data-url="https://twitter.com/intent/tweet?text=[selected_text]&url=[url]" data-post-url="https%3A%2F%2Fsupportivy.com%2Fliste-des-codes-html-supportivy%2F" data-image-url="" data-title="Liste%20des%20codes%20HTML%20%7C%20%20Supportivy" ><i class="fa fa-twitter"><svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg></i></a>
</div>
<div class="selectShare-arrowClip">
<div class="selectShare-arrow"></div>
</div>
</div>
</div><!-- Mobile Navigation
============================================= -->
<div id="jeg_off_canvas" class="normal">
<a href="#" class="jeg_menu_close"><i class="jegicon-cross"></i></a>
<div class="jeg_bg_overlay"></div>
<div class="jeg_mobile_wrapper">
<div class="nav_wrap">
<div class="item_main">
<!-- Search Form -->
<div class="jeg_aside_item jeg_search_wrapper jeg_search_no_expand round">
<a href="#" aria-label="Search Button" class="jeg_search_toggle"><i class="fa fa-search"></i></a>
<form action="https://supportivy.com/" method="get" class="jeg_search_form" target="_top">
<input name="s" class="jeg_search_input" placeholder="Search..." type="text" value="" autocomplete="off">
<button aria-label="Search Button" type="submit" class="jeg_search_button btn"><i class="fa fa-search"></i></button>
<closeform></closeform></form>
<!-- jeg_search_hide with_result no_result -->
<div class="jeg_search_result jeg_search_hide with_result">
<div class="search-result-wrapper">
</div>
<div class="search-link search-noresult">
No Result </div>
<div class="search-link search-all-button">
<i class="fa fa-search"></i> View All Result </div>
</div></div><div class="jeg_aside_item">
<ul class="jeg_mobile_menu sf-js-hover"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home menu-item-11781"><a href="https://supportivy.com/">Accueil</a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-204597"><a href="https://supportivy.com/category/astuces/">Astuces</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-42591"><a href="#">Magazine</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-38373"><a href="https://supportivy.com/category/conseil-en-relations/">Conseil en relations</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-38374"><a href="https://supportivy.com/category/conseil-en-relations/astuces-conseil-en-relations/">Astuces</a></li>
</ul>
</li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-38375"><a href="https://supportivy.com/category/redaction-ecriture/">Rédaction & écriture</a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-38376"><a href="https://supportivy.com/category/web-design/">Web Design</a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-38354"><a href="https://supportivy.com/category/reseaux-sociaux/">Réseaux sociaux</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-38355"><a href="https://supportivy.com/category/reseaux-sociaux/facebook/">Facebook</a></li>
</ul>
</li>
</ul>
</li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-95827"><a href="https://supportivy.com/category/lifestyle/">Lifestyle</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-95826"><a href="https://supportivy.com/category/food-2/">Food</a></li>
</ul>
</li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-11782"><a href="https://supportivy.com/category/ressources/">Ressources</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-42590"><a href="https://supportivy.com/category/questions-reponses/">Questions & Réponses</a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-38139"><a href="https://supportivy.com/category/ressources/graphique/">Graphique</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-38140"><a href="https://supportivy.com/category/ressources/graphique/pixelart/">PixelArt</a></li>
</ul>
</li>
</ul>
</li>
</ul></div> </div>
<div class="item_bottom">
<div class="jeg_aside_item socials_widget nobg">
<a href="https://www.facebook.com/SupportIvy-2034071233571517" target='_blank' rel='external noopener nofollow' aria-label="Find us on Facebook" class="jeg_facebook"><i class="fa fa-facebook"></i> </a><a href="https://www.pinterest.com/supportivy/_saved/" target='_blank' rel='external noopener nofollow' aria-label="Find us on Pinterest" class="jeg_pinterest"><i class="fa fa-pinterest"></i> </a></div> </div>
</div> </div>
</div><div class="jeg_read_progress_wrapper"></div><script type="text/javascript" id="toc-front-js-extra">
/* <![CDATA[ */
var tocplus = {"visibility_show":"Afficher","visibility_hide":"Masquer","visibility_hide_by_default":"1","width":"Auto"};
/* ]]> */
</script>
<script type="text/javascript" src="https://supportivy.com/wp-content/plugins/table-of-contents-plus/front.min.js?ver=2411.1" id="toc-front-js"></script>
<script type="text/javascript" src="https://supportivy.com/wp-includes/js/comment-reply.min.js?ver=6.7.2" id="comment-reply-js" async="async" data-wp-strategy="async"></script>
<script type="text/javascript" src="https://supportivy.com/wp-includes/js/hoverIntent.min.js?ver=1.10.2" id="hoverIntent-js"></script>
<script type="text/javascript" src="https://supportivy.com/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js"></script>
<script type="text/javascript" id="jnews-frontend-js-extra">
/* <![CDATA[ */
var jnewsoption = {"login_reload":"https:\/\/supportivy.com\/liste-des-codes-html-supportivy","popup_script":"magnific","single_gallery":"","ismobile":"","isie":"","sidefeed_ajax":"","language":"fr_FR","module_prefix":"jnews_module_ajax_","live_search":"1","postid":"40181","isblog":"1","admin_bar":"0","follow_video":"","follow_position":"top_right","rtl":"0","gif":"","lang":{"invalid_recaptcha":"Invalid Recaptcha!","empty_username":"Please enter your username!","empty_email":"Please enter your email!","empty_password":"Please enter your password!"},"recaptcha":"0","site_slug":"\/","site_domain":"supportivy.com","zoom_button":"0","dm_cookie_time":"0"};
/* ]]> */
</script>
<script type="text/javascript" src="https://supportivy.com/wp-content/themes/jnews/assets/dist/frontend.min.js?ver=11.6.8" id="jnews-frontend-js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="https://supportivy.com/wp-content/themes/jnews/assets/js/html5shiv.min.js?ver=11.6.8" id="html5shiv-js"></script>
<![endif]-->
<script type="text/javascript" src="https://stats.wp.com/e-202517.js" id="jetpack-stats-js" data-wp-strategy="defer"></script>
<script type="text/javascript" id="jetpack-stats-js-after">
/* <![CDATA[ */
_stq = window._stq || [];
_stq.push([ "view", JSON.parse("{\"v\":\"ext\",\"blog\":\"150522131\",\"post\":\"40181\",\"tz\":\"2\",\"srv\":\"supportivy.com\",\"j\":\"1:13.6.1\"}") ]);
_stq.push([ "clickTrackerInit", "150522131", "40181" ]);
/* ]]> */
</script>
<script type="text/javascript" id="jnews-select-share-js-extra">
/* <![CDATA[ */
var jnews_select_share = {"is_customize_preview":""};
/* ]]> */
</script>
<script type="text/javascript" src="https://supportivy.com/wp-content/plugins/jnews-social-share/assets/js/plugin.js" id="jnews-select-share-js"></script>
<script></script><script type="module">;/*! instant.page v5.1.1 - (C) 2019-2020 Alexandre Dieulot - https://instant.page/license */
let t,e;const n=new Set,o=document.createElement("link"),i=o.relList&&o.relList.supports&&o.relList.supports("prefetch")&&window.IntersectionObserver&&"isIntersecting"in IntersectionObserverEntry.prototype,s="instantAllowQueryString"in document.body.dataset,a="instantAllowExternalLinks"in document.body.dataset,r="instantWhitelist"in document.body.dataset,c="instantMousedownShortcut"in document.body.dataset,d=1111;let l=65,u=!1,f=!1,m=!1;if("instantIntensity"in document.body.dataset){const t=document.body.dataset.instantIntensity;if("mousedown"==t.substr(0,9))u=!0,"mousedown-only"==t&&(f=!0);else if("viewport"==t.substr(0,8))navigator.connection&&(navigator.connection.saveData||navigator.connection.effectiveType&&navigator.connection.effectiveType.includes("2g"))||("viewport"==t?document.documentElement.clientWidth*document.documentElement.clientHeight<45e4&&(m=!0):"viewport-all"==t&&(m=!0));else{const e=parseInt(t);isNaN(e)||(l=e)}}if(i){const n={capture:!0,passive:!0};if(f||document.addEventListener("touchstart",(function(t){e=performance.now();const n=t.target.closest("a");h(n)&&v(n.href)}),n),u?c||document.addEventListener("mousedown",(function(t){const e=t.target.closest("a");h(e)&&v(e.href)}),n):document.addEventListener("mouseover",(function(n){if(performance.now()-e<d)return;if(!("closest"in n.target))return;const o=n.target.closest("a");h(o)&&(o.addEventListener("mouseout",p,{passive:!0}),t=setTimeout((()=>{v(o.href),t=void 0}),l))}),n),c&&document.addEventListener("mousedown",(function(t){if(performance.now()-e<d)return;const n=t.target.closest("a");if(t.which>1||t.metaKey||t.ctrlKey)return;if(!n)return;n.addEventListener("click",(function(t){1337!=t.detail&&t.preventDefault()}),{capture:!0,passive:!1,once:!0});const o=new MouseEvent("click",{view:window,bubbles:!0,cancelable:!1,detail:1337});n.dispatchEvent(o)}),n),m){let t;(t=window.requestIdleCallback?t=>{requestIdleCallback(t,{timeout:1500})}:t=>{t()})((()=>{const t=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){const n=e.target;t.unobserve(n),v(n.href)}}))}));document.querySelectorAll("a").forEach((e=>{h(e)&&t.observe(e)}))}))}}function p(e){e.relatedTarget&&e.target.closest("a")==e.relatedTarget.closest("a")||t&&(clearTimeout(t),t=void 0)}function h(t){if(t&&t.href&&(!r||"instant"in t.dataset)&&(a||t.origin==location.origin||"instant"in t.dataset)&&["http:","https:"].includes(t.protocol)&&("http:"!=t.protocol||"https:"!=location.protocol)&&(s||!t.search||"instant"in t.dataset)&&!(t.hash&&t.pathname+t.search==location.pathname+location.search||"noInstant"in t.dataset))return!0}function v(t){if(n.has(t))return;const e=document.createElement("link");e.rel="prefetch",e.href=t,document.head.appendChild(e),n.add(t)}</script><div class="jeg_ad jnews_mobile_sticky_ads "></div><script type='application/ld+json'>{"@context":"http:\/\/schema.org","@type":"article","mainEntityOfPage":{"@type":"WebPage","@id":"https:\/\/supportivy.com\/liste-des-codes-html-supportivy\/"},"dateCreated":"2020-10-24 08:35:37","datePublished":"2020-10-24 08:35:37","dateModified":"2020-10-24 06:35:37","url":"https:\/\/supportivy.com\/liste-des-codes-html-supportivy\/","headline":"Liste des codes HTML | Supportivy","name":"Liste des codes HTML | Supportivy","articleBody":"<br>\n<figure class=\"image image-primary\" id=\"image-primary\" data-track-section=\"Image - Primary\" style=\"width:329px\"><img src=\"https:\/\/supportivy.com\/wp-content\/uploads\/2020\/10\/Liste-des-codes-HTML-Supportivy.jpg\" alt=\"Liste des codes HTML\"><figcaption>Cliquez pour t\u00e9l\u00e9charger une liste de codes HTML imprimable.<\/figcaption><\/figure><p> Les personnes qui apprennent les bases de la conception Web peuvent souhaiter conserver une liste de codes HTML \u00e0 port\u00e9e de main pour r\u00e9f\u00e9rence et comprendre ce que les balises sont con\u00e7ues pour accomplir. Conna\u00eetre leur objectif vous aidera \u00e0 cr\u00e9er une structure conviviale pour le r\u00e9f\u00e9rencement de votre site.<\/p>\n\n<h2> Codes HTML utilis\u00e9s dans la conception Web<\/h2>\n<p> Lorsque vous apprenez \u00e0 concevoir une page Web, c'est plus simple si vous comprenez le HTML de base, m\u00eame si vous utilisez un \u00e9diteur ou un constructeur de site Web. Conna\u00eetre les bases vous aidera \u00e0 comprendre comment la page est lue par les navigateurs.<\/p>\n<p> Si vous avez besoin d'aide pour t\u00e9l\u00e9charger la liste imprimable, consultez ces conseils utiles.<\/p>\n<p> Toutes les pages Web ont ce code de base:<\/p>\n<p> <! DOCTYPE html>: Cette balise a \u00e9t\u00e9 simplifi\u00e9e en HTML5 depuis que les multiples d\u00e9clarations <doctype> ont \u00e9t\u00e9 \u00e9limin\u00e9es - ne laissant qu'une seule: html. En HTML 4.01, les d\u00e9clarations <doctype> incluent: strict, transitionnel, frameset et les d\u00e9clarations XHTML 1.0 de strict, transitionnel, frameset et XHTML 1.1.<\/p>\n<p> <strong><HTML><\/strong>: Commence votre document<\/p>\n<p> <strong><HEAD><\/strong>: Contient des informations sur la page telles que les balises META et le titre; ceci n'est pas rendu dans le navigateur Web<\/p>\n<p> <strong><TITLE><\/strong>: Le titre de votre page - visible dans l'onglet du navigateur<\/p>\n<p> <strong><\/TITLE><\/strong>: Se ferme <strong><TITLE><\/strong> marque<\/p>\n<p> <strong><\/HEAD><\/strong>: Se ferme <strong><HEAD><\/strong> marque<\/p>\n<p> <strong><CORPS><\/strong>: Il s'agit de la zone de contenu de votre page Web - o\u00f9 vous allez inclure du texte, des images, des graphiques, etc.<\/p>\n<p> Tout ce qui se trouve \u00e0 l'int\u00e9rieur de la balise <body> est visible dans le navigateur. \u00c0 la fin de votre page HTML, vous devez fermer les balises ouvertes en utilisant:<\/p>\n<p> <strong><\/BODY><\/strong> pour fermer le <strong><CORPS><\/strong> \u00e9tiquette et<\/p>\n<p> <strong><\/HTML><\/strong> pour fermer le <strong><HTML><\/strong> marque.<\/p>\n<h2> Liste des balises introduites dans HTML5<\/h2>\n<p> La plupart des balises introduites dans HTML5 sont con\u00e7ues pour traiter du contenu qui n'\u00e9tait pas r\u00e9pandu lors de la cr\u00e9ation de HTML 4.01. Ces nouvelles balises traitent du contenu comme les m\u00e9dias ou les balises sont un meilleur moyen de d\u00e9finir la structure de la page. Voici les balises introduites dans HTML5.<\/p>\n<ul>\n<li><! DOCTYPE HTML> D\u00e9finit le type de document - html est le seul type en HTML5 <\/li> <li><article> <\/article> D\u00e9finit un article <\/li> <li><aside> <\/aside> D\u00e9finit une barre lat\u00e9rale - ou \u00e0 c\u00f4t\u00e9 - d'un article <\/li> <li><audio> <\/audio> D\u00e9signe les fichiers audio <\/li> <li><bdi> <\/bdi> Isole une partie du texte qui pourrait \u00eatre format\u00e9e dans une direction diff\u00e9rente de celle du texte en dehors. <\/li> <li><canvas> <\/canvas> C'est le conteneur qui contient tout langage de script utilis\u00e9 pour dessiner des graphiques \u00e0 la vol\u00e9e <\/li> <li><command> <\/command> D\u00e9finit un bouton de commande sur lequel les utilisateurs peuvent cliquer - dans un formulaire <\/li> <li><datalist> <\/datalist> Utilis\u00e9 dans un formulaire. Il d\u00e9signe une liste d'options pr\u00e9d\u00e9finies pour l'entr\u00e9e <\/li> <li><details> <\/details> D\u00e9finit les informations suppl\u00e9mentaires qu'un utilisateur peut afficher ou masquer <\/li> <li><dialog> <\/dialog> D\u00e9finit une bo\u00eete de dialogue ou une fen\u00eatre. <\/li> <li><embed> <\/embed> Ceci est un conteneur pour une application externe (non HTML) - comme une vid\u00e9o <\/li> <li><figcaption> <figcaption> La l\u00e9gende du contenu <figure> <\/li> <li><figure> <\/figure> Sp\u00e9cifie un contenu autonome comme une image <\/li> <li><header> <\/header> D\u00e9finit la partie d'en-t\u00eate du document ou une section \u00e0 l'int\u00e9rieur du document <\/li> <li><keygen> <\/keygen> Utilis\u00e9 pour d\u00e9finir un champ de g\u00e9n\u00e9rateur de paires de cl\u00e9s dans les formulaires <\/li> <li><mark> <\/mark> D\u00e9finit le texte mis en surbrillance ou marqu\u00e9 <\/li> <li><meter> <\/meter> D\u00e9finit une mesure scalaire dans une plage connue (une jauge) - par exemple 2 sur 10 <\/li> <li><nav> <\/nav> Liens de navigation <\/li> <li><output> <\/output> Sp\u00e9cifie la sortie du calcul <\/li> <li><progress> <\/progress> Repr\u00e9sente la progression d'une t\u00e2che <\/li> <li><rp> <\/rp> D\u00e9finit les \u00e9l\u00e9ments \u00e0 afficher dans les navigateurs qui ne prennent pas en charge les annotations ruby <\/li> <li><rt> <\/rt> D\u00e9finit une explication \/ prononciation des caract\u00e8res (pour la typographie est-asiatique) <\/li> <li><ruby> <\/ruby> D\u00e9finit une annotation ruby \u200b\u200b(pour la typographie est-asiatique) <\/li> <li><section> <\/section> D\u00e9finit une section sp\u00e9cifique \u00e0 l'int\u00e9rieur d'un document <\/li> <li><source> <\/source> D\u00e9finit plusieurs ressources multim\u00e9dias pour les \u00e9l\u00e9ments multim\u00e9dias tels que <video> ou <audio> <\/li> <li><summary> <\/summary> D\u00e9finit un en-t\u00eate visible pour un \u00e9l\u00e9ment <details> <\/li> <li><time> <\/time> Date et heure <\/li> <li><track> <\/track> D\u00e9finit les pistes de texte pour les \u00e9l\u00e9ments multim\u00e9dias tels que <video> ou <audio> <\/li> <li><video> <\/video> Un film ou une vid\u00e9o <\/li> <li><wbr> <\/wbr> D\u00e9finit un saut de ligne possible <\/li> <\/ul>\n<h2> Liste des balises HTML 4.01 non prises en charge dans HTML5<\/h2>\n<p> Une poign\u00e9e de balises ont \u00e9t\u00e9 supprim\u00e9es dans HTML5 en raison de leur manque d'utilisation - ou parce qu'elles \u00e9taient utilis\u00e9es d'une mani\u00e8re autre que leur utilisation pr\u00e9vue.<\/p>\n<ul>\n<li><acronym> <acronym> D\u00e9finit un acronyme <\/li> <li><basefont> <\/basefont> D\u00e9signe la couleur, la taille et la police par d\u00e9faut du texte du document <\/li> <li><big> <\/big> Agrandit le texte <\/li> <li><center> <\/center> Centre du texte <\/li> <li><dir> <\/dir> Liste des r\u00e9pertoires <\/li> <li><font> <\/font> Utilis\u00e9 pour d\u00e9finir la couleur, la taille et la police dans un document <\/li> <li><frame> <\/frame> D\u00e9finit un cadre \u00e0 l'int\u00e9rieur d'un jeu de cadres <\/li> <li><frameset> <\/frameset> Sp\u00e9cifie un ensemble de cadres <\/li> <li><noframes> <\/noframes> D\u00e9finit un contenu alternatif pour les utilisateurs qui ne prennent pas en charge les cadres <\/li> <li><strike> <\/strike> Texte barr\u00e9 <\/li> <li><tt> <\/tt> T\u00e9l\u00e9type du texte <\/li> <\/ul>\n<h2> Liste des codes HTML compatibles en HTML 4.01 et HTML5<\/h2>\n<p> Voici une liste de balises HTML 4.01 qui font \u00e9galement partie de la norme HTML5:<\/p>\n<ul>\n<li><! --...--> D\u00e9finit un commentaire <\/li> <li><a> <\/a> Hyperlien <\/li> <li><abbr> <\/abbr> Abr\u00e9viation <\/li> <li><address> <\/address> D\u00e9finit les informations d'adresse du propri\u00e9taire du document <\/li> <li><applet> <\/applet> D\u00e9finit une applet int\u00e9gr\u00e9e <\/li> <li><area> <\/area> D\u00e9finit une zone \u00e0 l'int\u00e9rieur d'une image-map <\/li> <li><base> <\/base> URL \/ cible de base pour toutes les URL relatives d'un document <\/li> <li><bdo> <\/bdo> Remplace la direction actuelle du texte <\/li> <li><blockquote> <\/blockquote> Section cit\u00e9e d'une autre source <\/li> <li><body> <\/body> D\u00e9finit le corps du document <\/li> <li><br> Saut de ligne <\/li> <li><button> <\/button> D\u00e9finit un bouton cliquable <\/li> <li><caption> <\/caption> D\u00e9finit la l\u00e9gende d'un tableau <\/li> <li><cite> <\/cite> Titre d'une \u0153uvre <\/li> <li><code> <\/code> Codage informatique <\/li> <li><col> <\/col> Colonnes dans un tableau <\/li> <li><colgroup> <\/colgroup> Groupe d'une ou plusieurs colonnes dans un tableau <\/li> <li><dd> <\/dd> Description de la d\u00e9finition <\/li> <li><del> <\/del> Texte supprim\u00e9 du document <\/li> <li><dfn> <\/dfn> Terme de d\u00e9finition <\/li> <li><dl> <\/dl> Liste de d\u00e9finitions <\/li> <li><div> <\/div> Section dans un document <\/li> <li><dt> <dt> Terme de d\u00e9finition <\/li> <li><em> <\/em> Emphase <\/li> <li><embed> <\/embed> Incorporer un \u00e9l\u00e9ment <\/li> <li><fieldset> <\/fieldset> Regroupe les \u00e9l\u00e9ments associ\u00e9s dans un formulaire <\/li> <li><form> <\/form> Formulaire <\/li> <li><a name=\"\"> <\/a> ancre <\/li> <li><h1> <\/h1> Titre 1; utilisez 2, 3, 4, etc. pour diff\u00e9rentes tailles <\/li> <li><hr> R\u00e8gle horizontale <\/li> <li><i> <\/i> Italiques <\/li> <li><img src = \"\"> Image <\/li> <li><ol> <\/ol> Liste ordonn\u00e9e <\/li> <li><ul> <\/ul> Liste non ordonn\u00e9e <\/li> <li><li> <\/li> \u00c9l\u00e9ment de liste <\/li> <li><marquee> <\/marquee> Texte d\u00e9filant <\/li> <li><meta> Utilis\u00e9 pour sp\u00e9cifier la description de la page, les mots cl\u00e9s, l'auteur et d'autres informations pertinentes sur la page <\/li> <li><p> Paragraphe <\/li> <li><small> <\/small> R\u00e9duit le texte <\/li> <li><table> <\/table> Tableau <\/li> <\/ul>\n<h2> Extraits <html> utiles<\/h2>\n<p> L'une des balises HTML les plus couramment utilis\u00e9es est probablement <table>. La plupart des tableaux utilisent trois balises principales: une pour le conteneur, une pour les informations \u00e0 l'int\u00e9rieur de la table et une pour d\u00e9signer une ligne \u00e0 l'int\u00e9rieur de la table.<\/p>\n<h3> Tableau HTML<\/h3>\n<p> Pour cr\u00e9er un tableau avec deux lignes et deux colonnes, vous utilisez les trois balises. Bien que vous puissiez styliser depuis l'int\u00e9rieur de la balise, par exemple, <table border = \"1\">, la m\u00e9thode pr\u00e9f\u00e9r\u00e9e est de contr\u00f4ler l'apparence avec CSS.<\/p>\n<p> <table><br><tr><br><td> Ceci est la premi\u00e8re case de la ligne 1 <\/td><br><td> Ceci est la deuxi\u00e8me case de la ligne 1 <\/td><br><\/ tr><br><tr><br><td> Ceci est la premi\u00e8re case de la ligne 2 <\/td><br><td> Ceci est la deuxi\u00e8me case de la ligne 2 <\/td><br><\/ tr><br><\/ table><\/p>\n<p> La m\u00eame table avec une colonne d'en-t\u00eate qui s'\u00e9tend sur les deux colonnes ressemblerait \u00e0 ceci.<\/p>\n<p> <table><br><tr><br><th colspan = \"2\"> Cette ligne s'\u00e9tend sur les deux lignes en dessous. <\/th> Le <th> - en-t\u00eate du tableau - met en gras et centre le texte.<br><\/tr><br><tr><br><td> Ceci est la premi\u00e8re case de la ligne 1 <\/td><br><td> Ceci est la deuxi\u00e8me case de la ligne 1 <\/td><br><\/ tr><br><tr><br><td> Ceci est la premi\u00e8re case de la ligne 2 <\/td><br><td> Ceci est la deuxi\u00e8me case de la ligne 2 <\/td><br><\/ tr><br><\/table><\/p>\n<h3> Liste de choses \u00e0 faire<\/h3>\n<p> En tirant parti du stockage local, la derni\u00e8re version de Google Chrome et d'autres navigateurs, vous permet de cr\u00e9er une liste qui peut \u00eatre modifi\u00e9e \u00e0 partir du navigateur de l'utilisateur. Pour le configurer, vous devez associer l'attribut <em>contenteditable<\/em> avec la liste.<\/p>\n<p> <h2> Ma liste modifiable <\/h2><br><ul contenteditable = \"true\"><br><li> Aller \u00e0 l'\u00e9picerie <\/li><br><li> D\u00e9poser les documents au bureau <\/li><br><li> Terminer les courses <\/li><br><\/ul><\/p>\n<p> Lorsque les utilisateurs acc\u00e8dent au codage ci-dessus \u00e0 partir de nouveaux navigateurs (et non d'Internet Explorer), ils peuvent \u00e9diter et changer la liste \u00e0 leur guise.<\/p>\n<h2> Comment le CSS interagit avec le HTML<\/h2>\n<p> Le HTML est un langage de balisage et son r\u00f4le est de structurer la page. \u00c9tant donn\u00e9 que le langage de balisage est lu de haut en bas par le navigateur, les informations les plus importantes doivent \u00eatre en haut de la page - et \u00eatre envelopp\u00e9es dans la balise appropri\u00e9e. Le titre du haut doit toujours \u00eatre une balise - g\u00e9n\u00e9ralement un<\/p>\n\n<h2> , les paragraphes vont \u00e0 l'int\u00e9rieur<\/h2>\n<p> , etc. de cette fa\u00e7on, le navigateur (et les moteurs de recherche) peuvent valider la hi\u00e9rarchie d'importance pour le texte de la page.<\/p>\n<p> \u00c9tant donn\u00e9 que HTML ne doit \u00eatre utilis\u00e9 que pour la structure d'un document, CSS est utilis\u00e9 pour la conception et l'aspect. Bien que certaines balises HTML puissent avoir un style minimal sans CSS, la meilleure pratique consiste \u00e0 contr\u00f4ler la conception de votre site avec CSS. CSS fonctionne en cr\u00e9ant des noms pour les diff\u00e9rents types de contenu sur votre page. Lorsque le navigateur lit un \u00abnom\u00bb CSS - il applique le style - associ\u00e9 \u00e0 ce nom - au contenu.<\/p>\n<h2> Vous ne vous souvenez pas de toutes les balises?<\/h2>\n<p> La bonne chose est que vous n'en avez pas besoin - vous pouvez utiliser une liste de r\u00e9f\u00e9rences comme celle-ci pour v\u00e9rifier \u00e0 quoi sert une balise - ou utiliser un \u00e9diteur HTML avec une r\u00e9f\u00e9rence int\u00e9gr\u00e9e comme HTML-Kit. Ce qui est plus important que de m\u00e9moriser toutes les balises, c'est de concevoir des pages en pensant aux navigateurs actuels et futurs. En faisant cela, lorsque les utilisateurs rattraperont et installeront le navigateur le plus r\u00e9cent, les nouvelles balises seront d\u00e9j\u00e0 en place - et fonctionneront comme pr\u00e9vu.<\/p> \r\n\r\nLisez plus d'astuces sur <a href=\"\"https:\/\/supportivy.com\/category\/web-design\/\"> le design web ici<\/a>, et n'oubliez pas de partager l'article sur Facebook !","author":{"@type":"Person","name":"Xavier A.","url":"https:\/\/supportivy.com\/author\/xavier-a\/"},"articleSection":["Web Design"],"image":{"@type":"ImageObject","url":"https:\/\/supportivy.com\/wp-content\/uploads\/2020\/10\/Liste-des-codes-HTML-Supportivy.jpg","width":329,"height":425},"publisher":{"@type":"Organization","name":"","url":"https:\/\/supportivy.com","logo":{"@type":"ImageObject","url":""},"sameAs":["https:\/\/www.facebook.com\/SupportIvy-2034071233571517","https:\/\/www.pinterest.com\/supportivy\/_saved\/"]}}</script>
<script type='application/ld+json'>{"@context":"http:\/\/schema.org","@type":"hentry","entry-title":"Liste des codes HTML | Supportivy","published":"2020-10-24 08:35:37","updated":"2020-10-24 06:35:37"}</script>
<script type='application/ld+json'>{"@context":"http:\/\/schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"item":{"@id":"https:\/\/supportivy.com","name":"Home"}},{"@type":"ListItem","position":2,"item":{"@id":"https:\/\/supportivy.com\/category\/web-design\/","name":"Web Design"}}]}</script>
<script type="text/javascript">;!function(){"use strict";window.jnews=window.jnews||{},window.jnews.first_load=window.jnews.first_load||{},window.jnews.first_load=function(){var e=this,t=jnews.library,n="object"==typeof jnews&&"object"==typeof jnews.library;e.data=null,e.run_ajax=!0,e.run_loginregister=!0,e.clear=function(){e.run_ajax=!0,e.run_loginregister=!0,e.data=null},e.init=function(){n&&(t.globalBody.querySelectorAll(".jeg_popup_account").length&&jnews.loginregister&&e.run_loginregister&&(e.run_loginregister=!1,jnews.loginregister.init(),jnews.loginregister.hook_form()),jfla.length&&e.run_ajax&&(e.run_ajax=!1,e.do_ajax({action:"jnews_first_load_action",jnews_id:jnewsoption.postid,load_action:jfla})))},e.update_counter=function(){if(n){var o={total_view:t.globalBody.querySelectorAll(".jeg_share_stats .jeg_views_count .counts"),total_share:t.globalBody.querySelectorAll(".jeg_share_stats .jeg_share_count .counts"),total_comment:t.globalBody.querySelectorAll(".jeg_meta_comment a span")};t.forEach(Object.entries(e.data.counter),(function([e,n]){o[e].length&&t.forEach(o[e],(function(e,o){t.setText(e,n)}))}))}},e.do_ajax=function(o){if(n){var a=new XMLHttpRequest;a.onreadystatechange=function(){XMLHttpRequest.DONE===a.readyState&&200==a.status&&(e.data=JSON.parse(a.responseText),e.data.counter&&"object"==typeof e.data.counter&&e.update_counter())},a.open("POST",jnews_ajax_url,!0),a.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=UTF-8"),a.send(t.httpBuildQuery(o))}}},window.jnews.first_load=new window.jnews.first_load,jnews.first_load.init()}();</script></body>
</html>