Maison >interface Web >tutoriel CSS >Comment référencer CSS en HTML
Comment référencer CSS en HTML
- php中世界最好的语言original
- 2017-11-21 17:24:332864parcourir
Il existe quatre façons de référencer des feuilles de style CSS. Utilisez les styles CSS directement dans les divs pour créer des pages Web div+css, utilisez le style intégré en HTML, utilisez @import pour référencer des fichiers CSS externes et utilisez un lien vers. référencer des fichiers CSS externes. Chacune présente des avantages et des inconvénients, nous allons donc aujourd'hui expliquer en détail les différences entre ces quatre méthodes.
L'utilisation de différentes méthodes pour référencer des feuilles de style CSS obtiendra finalement le même effet, mais l'utilisation de différentes méthodes pour appliquer des fichiers CSS affectera le référencement et la vitesse et l'efficacité d'ouverture des pages Web. Ensuite, nous expliquerons un par un les exemples de référencement CSS en HTML
1. Intégrez les styles CSS directement dans les éléments de balise HTML, tels que 38b138a0b84d8bf132770eb91ea74c1c
2. Insérez le code de la déclaration de style dans la partie head de l'en-tête HTML comme suit :
<style type="text/css">
<!--
.ceshi {font-size:14px; color:#FF0000;}/*这里是设置CSS的样式内容*/
-->
</style>3. Utilisez @import pour référencer des fichiers CSS externes
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css引用方法实例</title> <style type="text/css"> <!-- @import url(wcss.css);/*这里是通过@import引用CSS的样式内容*/ --> </style> </head> <body> <div class="ceshi">我是测试内容</div> </body> </html>
Code dans le fichier Wcss.css.ceshi {font-size:14px; color:#FF0000;}
On peut voir que l'utilisation de cette méthode est similaire à l'utilisation de la méthode de feuille de style CSS de référence intégrée. Les deux doivent utiliser la balise de style dans l'en-tête du HTML pour référencer le CSS externe. .
4. Utilisez le lien pour appeler le fichier CSS externe
Placez le type bd350a64f73cbd03680a9036e764c472 Pour appeler le fichier wcss.css externe pour implémenter le fichier css de référence html
Cette méthode ne nécessite pas la balise de style, mais fait directement référence au style externe en liant un style
Il est généralement recommandé d'utiliser un lien pour référencer des méthodes de style CSS externes.
Avantages de l'utilisation d'un lien pour référencer des fichiers CSS externes
1. Il est bénéfique pour le référencement. L'utilisation de cette méthode pour référencer des fichiers CSS externes rendra le code source de la page HTML beaucoup plus petit que l'ajout direct. styles CSS. , car les robots des moteurs de recherche n'explorent pas les fichiers CSS lors de l'exploration des pages Web, ce qui entraîne très peu de codes sources HTML, ce qui permet aux robots d'explorer plus rapidement et de traiter moins, ce qui augmente le poids de cette page Web et est bénéfique pour les classements.
2. L'enregistrement HTML permet au navigateur de séparer les fils de discussion lors du téléchargement de pages Web, tout comme le chargement d'une page et l'ouverture d'une page par deux lignes en même temps, ce qui rend la page Web ouverte très rapidement. (Lorsque l'utilisateur parcourt cette page Web, le code source html et le fichier css sont téléchargés en même temps, ce qui le rend plus rapide)
3. Il est pratique de modifier le style de la page Web. Il vous suffit de modifier. le style CSS pour modifier le style artistique de la page Web. Si sur le site Web Dans cette méthode de projet, puisque l'ensemble du site utilise un style CSS commun, il est rapide et pratique de modifier le style de l'ensemble du site.
Voici les quatre façons de citer des feuilles de style CSS. Les amis qui en ont besoin peuvent les enregistrer. Veuillez également continuer à prêter attention aux autres mises à jour sur ce site.
Recommandations associées :
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!