En HTML, les principales méthodes d'introduction du CSS sont l'inline, l'incorporé, l'importé et le lien
Inline : consiste à définir le style CSS dans l'attribut style de la marque. Cette méthode est essentiellement les avantages du CSS. ne sont pas reflétés dans ce qui précède, donc l'utilisation de
n'est pas recommandée. Exemple :
Démo texte
Ceci est une ligne de texte.
Embedded : Embedded consiste à écrire les paramètres de divers éléments de la page entre et . Pour une seule page Web, cette méthode est très pratique. Mais pour un site Web contenant de nombreuses pages, si chaque page définit son propre style en ligne, elle perdra les énormes avantages apportés par CSS. Par conséquent, un site Web écrit généralement un fichier de feuille de style CSS indépendant, en utilisant les deux méthodes suivantes : introduit dans le document HTML.
Exemple :
< ;html>
Texte Démo< ;/title> ;<br><style type="text/css"><br>h1{<br> color:white;<br> background-color:boue;<br> }<br></ style><br> </head><br> <body><br><h1>Ceci est une ligne de texte.</h1><br><h1>Ceci est une autre ligne de texte. </ h1><br> </body><br> </html><br>
</div>
<br><strong>Importer et lier : </strong>Le but de l'importation et du lien est de convertir un Les fichiers CSS indépendants introduisent des fichiers HTML et il existe des différences correspondantes entre les deux. <br>En fait, la plus grande différence entre les deux est que le type de lien utilise des balises HTML pour introduire des fichiers CSS externes, tandis que le type d'importation utilise des règles CSS pour introduire des fichiers CSS externes. Leur syntaxe est donc également différente. <br>Si vous utilisez le style de lien, vous devez utiliser l'instruction suivante pour introduire des fichiers CSS externes. <br><link href="mystyle.css" rel="stylesheet" type="text/css" /><br>Si vous utilisez l'importation, vous devez utiliser l'instruction suivante. <br><br><div class="msgheader">
<div class="right"><span style="CURSOR: pointer" onclick="copycode(getid('phpcode61'));"><u>Copier le code</u></span></div>Le code est le suivant :</div>
<div class="msgborder" id="phpcode61">
<br><style type=" text/css "><br> @import"mystyle.css";<br></style><br>
</div>
<br>De plus, les effets d'affichage de ces deux méthodes sont également légèrement différents. Lors de l'utilisation de la méthode de lien, le fichier CSS sera chargé avant la partie principale de la page d'installation, de sorte que la page Web affichée ait un effet de style dès le début. Lors de l'utilisation de la méthode d'importation, le fichier CSS sera chargé après. la page entière est chargée. Pour certains navigateurs, dans certains cas, si la taille du fichier de la page Web est relativement grande, une page sans style sera affichée en premier, puis l'effet de style apparaîtra après un flash. Du point de vue du spectateur, il s’agit d’un inconvénient de l’utilisation de l’importation. Pour certains sites Web relativement volumineux, afin de faciliter la maintenance, vous souhaiterez peut-être placer tous les styles CSS dans plusieurs fichiers CSS. De cette façon, si vous utilisez l'importation de liens, vous aurez besoin de plusieurs instructions pour importer les fichiers CSS séparément. Si vous souhaitez ajuster la classification des fichiers CSS, vous devez ajuster les fichiers HTML en même temps. C'est un inconvénient pour les travaux de maintenance. Si vous utilisez la méthode d'importation, vous ne pouvez importer qu'un fichier CSS général, puis importer d'autres fichiers CSS indépendants dans ce fichier ; la méthode de lien n'a pas cette fonctionnalité ; <br><br>Donc, une suggestion ici est que si vous devez introduire un fichier CSS, utilisez la méthode link ; si vous devez introduire plusieurs fichiers CSS, utilisez d'abord la méthode link pour introduire un fichier CSS "répertoire", ceci Fichier CSS "Répertoire", puis utilisez l'importation pour introduire d'autres fichiers CSS. <br>Si vous souhaitez décider dynamiquement quel fichier CSS importer via JavaScript, vous devez utiliser la liaison pour y parvenir.</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="JavaScript en HTML sélectionner tout/désélectionner tout exemple d'opération code_HTML/Xhtml_production de page web" href="https://m.php.cn/fr/faq/11508.html">JavaScript en HTML sélectionner tout/désélectionner tout exemple d'opération code_HTML/Xhtml_production de page web</a></span><span>Article suivant：<a class="dBlack" title="JavaScript en HTML sélectionner tout/désélectionner tout exemple d'opération code_HTML/Xhtml_production de page web" href="https://m.php.cn/fr/faq/11510.html">JavaScript en HTML sélectionner tout/désélectionner tout exemple d'opération code_HTML/Xhtml_production de page web</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Articles Liés</h2><em><a href="https://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="https://m.php.cn/fr/faq/348757.html" title="Résumé des connaissances HTML" class="aBlack">Résumé des connaissances HTML</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/fr/faq/348804.html" title="Comment apprendre le HTML rapidement" class="aBlack">Comment apprendre le HTML rapidement</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/fr/faq/348873.html" title="La différence entre htmlxhtmlxml" class="aBlack">La différence entre htmlxhtmlxml</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/fr/faq/348884.html" title="La différence entre les attributs src et href" class="aBlack">La différence entre les attributs src et href</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/fr/faq/348902.html" title="关于HTML5和CSS替换使用" class="aBlack">关于HTML5和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="https://m.php.cn/fr/about/us.html">À propos de nous</a><a href="https://m.php.cn/fr/about/disclaimer.html">Clause de non-responsabilité</a><a href="https://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>
