Comment ajouter du style CSS au HTML ? Avantages et inconvénients des systèmes en ligne, embarqués et externes-tutoriel CSS-php.cn

Comment ajouter du style CSS au HTML ? Avantages et inconvénients des systèmes en ligne, embarqués et externes

青灯夜游

Libérer： 2018-11-02 14:32:31

original

16043 Les gens l'ont consulté

Comment ajouter du style CSS au HTML ? Cet article vous présentera trois méthodes pour ajouter des styles CSS au HTML : les avantages et les inconvénients des styles en ligne, intégrés et externes. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Tout d'abord, nous devons comprendre quelles sont les trois méthodes pour ajouter des styles CSS au HTML ? Ce sont :

1. Utilisez le CSS en ligne pour appliquer des règles à des éléments spécifiques, c'est-à-dire :

en ligne. Utilisez le CSS interne et dans la section Règles CSS, c'est-à-dire : inline

3. Lien vers un fichier externe (fichier .css) contenant toutes les règles CSS, c'est-à-dire : externe

Présentons-le en détail ci-dessous Parlons de la mise en œuvre et avantages et inconvénients des méthodes en ligne, intégrées et externes.

1. Inline

Le CSS en ligne doit être utilisé dans des balises HTML spécifiques. L'attribut . Un exemple de feuille de style interne :

Avantages du CSS embarqué :

<head>
  <style type="text/css">
    p {color:white; font-size: 10px;}
    .center {display: block; margin: 0 auto;}
    #button-go, #button-back {border: solid 1px black;}
  </style>
</head>

Copier après la connexion

1 La feuille de style n'affecte qu'une seule page.

2. Les feuilles de style internes peuvent utiliser des classes et des identifiants.

3. Pas besoin de télécharger plusieurs fichiers. HTML et CSS peuvent être dans le même fichier.

Inconvénients du CSS intégré :

1. Augmente le temps de chargement des pages.

2. Cela n'affecte qu'une seule page - inutile si vous souhaitez utiliser le même CSS sur plusieurs documents.

3. Liens externes

Le moyen le plus pratique d'ajouter du CSS à une page HTML est peut-être de la lier à un fichier externe (. fichier css). De cette façon, toutes les modifications que vous apportez aux fichiers CSS externes seront reflétées sur votre site Web. Les références aux fichiers CSS externes doivent être placées dans la section de la page, par exemple :

et style.css contient toutes les règles de style. Par exemple :

<head>
  <link rel="stylesheet" type="text/css" href="style.css" />
</head>

Copier après la connexion

Avantages du CSS externe :

.xleftcol {
   float: left;
   width: 33%;
   background:#809900;
}
.xmiddlecol {
   float: left;
   width: 34%;
   background:#eff2df;
}

Copier après la connexion

1 La taille de la page HTML est plus petite et la structure est plus claire.

2. Vitesse de chargement plus rapide.

3. Le même fichier .css peut être utilisé sur plusieurs pages.

Inconvénients du CSS externe :

1. La page peut ne pas s'afficher correctement avant le chargement du CSS externe.

Conclusion

Ce qui précède est l'intégralité du contenu de cet article, qui vous présente les différentes méthodes d'ajout de CSS aux pages html . Et comprenez les différences entre les feuilles de style en ligne, externes et internes. Vous devrez peut-être utiliser différentes méthodes pour ajouter des styles CSS. J'espère que cela vous sera utile pour votre apprentissage. [Apprentissage vidéo recommandé : tutoriel CSS]

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!