Il existe plusieurs types de feuilles de style CSS et comment les utiliser respectivement-tutoriel CSS-php.cn

Il existe plusieurs types de feuilles de style CSS et comment les utiliser respectivement

下次还敢

Libérer： 2024-04-06 02:30:20

original

572 Les gens l'ont consulté

Il existe trois types de feuilles de style CSS : en ligne, internes et externes. Les styles en ligne s'appliquent à des éléments spécifiques, les styles internes s'appliquent à l'ensemble du document et les styles externes peuvent être utilisés dans plusieurs documents. Avec CSS, une règle de style se compose d'un sélecteur, qui spécifie l'élément auquel le style doit être appliqué, et d'un bloc de déclaration, qui contient les propriétés et les valeurs du style. Différents types de feuilles de style ont leurs propres avantages et inconvénients : les styles en ligne sont plus spécifiques mais encombrent le document ; les styles internes sont moins spécifiques mais les styles externes sont les plus généraux et adaptés aux grands projets ;

Il existe plusieurs types de feuilles de style CSS et comment les utiliser respectivement

Types de feuilles de style CSS et comment les utiliser

Types de feuilles de style CSS

Il existe trois principaux types de feuilles de style CSS :

Styles en ligne : Écrites directement dans Éléments HTML Pour les styles, utilisez l'attribut style. style 属性。
内部样式：写在 <style> 元素内的样式，放置在 HTML 文档的 <head> 部分。
外部样式：写在独立文件（通常带有 .css 扩展名）中的样式，通过 <link>

Styles internes :

Styles écrits dans l'élément <style> et placés dans la section <head> du document HTML.

Styles externes :

Styles écrits dans des fichiers séparés (généralement avec une extension .css) et introduits dans les documents HTML via l'élément <link>.

Comment utiliser

Styles en ligne

<code class="html"><p style="color: red;">这是一个红色的段落。</p></code>

Copier après la connexion

Styles internes

<code class="html"><head>
  <style>
    p {
      color: blue;
    }
  </style>
</head></code>

Copier après la connexion

Styles externes

<code class="html"><head>
  <link rel="stylesheet" href="style.css">
</head></code>

Copier après la connexion

Dans les fichiers CSS, les règles de style sont constituées de sélecteurs et de blocs de déclaration :

Choisissez Spécifie l'élément auquel le style doit être appliqué :

<code class="css">p { /* 针对段落元素的样式 */ }</code>

Copier après la connexion

Contient des attributs et des valeurs de style : <code class="css">p { color: blue; /* 设置段落元素的文本颜色 */ font-size: 20px; /* 设置段落元素的字体大小 */ }</code>
Copier après la connexion

Styles en ligne : Spécifique, mais rend HTML documents Désorganisés.

Styles internes : 🎜Moins spécifiques, mais plus soignés que les styles en ligne. 🎜🎜🎜Style externe : 🎜Le plus polyvalent et réutilisable, recommandé pour les grands projets. 🎜🎜

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!