Maison  >  Article  >  interface Web  >  Jour 6 : Spécification du code XHTML_Tutoriel de base

Jour 6 : Spécification du code XHTML_Tutoriel de base

WBOY
WBOYoriginal
2016-05-16 12:09:581504parcourir

Avant de commencer la production formelle de contenu, nous devons d'abord comprendre les spécifications de code des standards du Web. Comprendre ces spécifications peut vous aider à éviter les détours et à vérifier le code d'accès dès que possible.

1. Toutes les balises doivent avoir une balise de fermeture correspondante

Dans le passé, en HTML, vous pouviez ouvrir de nombreuses balises, telles que

et

  • sans nécessairement écrire les balises

    Mais ce n'est pas légal en XHTML. XHTML nécessite une structure stricte et toutes les balises doivent être fermées. S'il s'agit d'une balise distincte non appariée, ajoutez un "/" à la fin de la balise pour la fermer. Par exemple :


    Web Designer

    2. Les noms de tous les éléments et attributs de la balise doivent être en minuscules

    Contrairement au HTML, XHTML est sensible à la casse et et <TITLE> XHTML exige que tous les noms de balises et d'attributs soient en minuscules. Par exemple : <BODY> doit être écrit sous la forme <body>. La casse mixte n'est pas non plus reconnue. Habituellement, le nom de l'attribut "onMouseOver" généré automatiquement par Dreamweaver doit également être remplacé par "onmouseover". </p> <h3>3. Toutes les balises XML doivent être raisonnablement imbriquées </h3> <p>De plus, parce que XHTML nécessite une structure stricte, toutes les imbrications doivent être dans l'ordre. Nous avions l'habitude d'écrire le code comme ceci : </p> <span class="code"><p><b></p>/b> ;</span> <p>doit être modifié en : </p> <span class="code"><p><b></b>/p></span> <p>C'est-à-dire que l'imbrication couche par couche doit être strictement symétrique. </p> <h3>4. Tous les attributs doivent être mis entre guillemets "" </h3> <p>En HTML, vous n'avez pas besoin de citer les valeurs d'attribut, mais en XHTML, elles doivent être citées. Par exemple :</p> <span class="code"><height=80></span> <p>doit être modifié en :</p> <span class="code"><height="80"></span> <p>Dans des cas particuliers, vous devez utiliser des guillemets doubles dans la valeur de l'attribut. Vous pouvez utiliser ", et les guillemets simples peuvent utiliser ', par exemple : </p> <span class="code"><alt="say'hello'">. ;</SPAN> <H3>5. Encodez tous les symboles < et & spéciaux </H3> <UL> <LI>Tout signe inférieur à (<) qui ne fait pas partie d'une balise doit être codé comme <SPAN class=code>& l t ;</SPAN> <LI>Tout signe supérieur à (>) qui ne fait pas partie d'une balise doit être codé comme <span class="code">& g t ;</span> <li>Toute esperluette (&) qui ne fait pas partie d'une entité doit être codée comme <span class="code">& a m p;</span> </li> <p>Remarque : Il n'y a pas d'espace entre les caractères ci-dessus. </p> <h3>6. Attribuez une valeur à tous les attributs</h3> <p>XHTML stipule que tous les attributs doivent avoir une valeur, et s'il n'y a pas de valeur, il se répétera. Par exemple : </p> <span class="code"><td nowrap></span> <span class="code"><input type="checkbox" name="shirt" value="medium" vérifié></span> <p>Doit être modifié par : </p> <span class="code"><td nowrap="nowrap"></span> <span class="code"><input type="checkbox" name="shirt" value="medium" vérifié= " coché "></span> <h3>7. N'utilisez pas de «--» dans le contenu du commentaire </h3> <p> "--" ne peut apparaître qu'au début et à la fin des commentaires XHTML, c'est-à-dire qu'ils ne sont plus valides dans le contenu. Par exemple, le code suivant n'est pas valide : </p> <span class="code"><!--Commentez ici----------Commentez ici--></span> <p>Remplacez les lignes pointillées internes par des signes égaux ou des espaces. </p> <span class="code"><!--Commentaires ici============Commentaires ici--></span> <p>Certaines des spécifications ci-dessus peuvent sembler étranges, mais elles visent toutes à faire en sorte que notre code ait une norme unifiée et unique pour faciliter la réutilisation future des données. </p></span></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Déclaration:</span><div>Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn</div></div></div><div class="nphpSytBox"><span>Article précédent:<a class="dBlack" title="Analyse de la conception de sites Web d'entreprises coréennes" href="http://m.php.cn/fr/faq/1162.html">Analyse de la conception de sites Web d'entreprises coréennes</a></span><span>Article suivant:<a class="dBlack" title="Analyse de la conception de sites Web d'entreprises coréennes" href="http://m.php.cn/fr/faq/1164.html">Analyse de la conception de sites Web d'entreprises coréennes</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Articles Liés</h2><em><a href="http://m.php.cn/fr/article.html" class="bBlack"><i>Voir plus</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/fr/faq/1796689075.html" title="Comment rendre les iFrames défilables dans Mobile Safari ?" class="aBlack">Comment rendre les iFrames défilables dans Mobile Safari ?</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/1796689095.html" title="Comment empêcher le débordement de texte dans les cellules d’un tableau à hauteur fixe ?" class="aBlack">Comment empêcher le débordement de texte dans les cellules d’un tableau à hauteur fixe ?</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/1796689100.html" title="Comment puis-je créer des coins arrondis pour les boîtes intérieures et les bordures ?" class="aBlack">Comment puis-je créer des coins arrondis pour les boîtes intérieures et les bordures ?</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/1796689101.html" title="Comment supprimer la marge inutile des éléments flexibles lors de leur emballage ?" class="aBlack">Comment supprimer la marge inutile des éléments flexibles lors de leur emballage ?</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/fr/faq/1796689116.html" title="Comment sélectionner le dernier enfant sans classe spécifique en CSS ?" class="aBlack">Comment sélectionner le dernier enfant sans classe spécifique en CSS ?</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!</p></div><div class="footermid"><a href="http://m.php.cn/fr/about/us.html">À propos de nous</a><a href="http://m.php.cn/fr/about/disclaimer.html">Clause de non-responsabilité</a><a href="http://m.php.cn/fr/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>