简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > tutoriel CSS > le corps du texte

Quels types de styles CSS existe-t-il ? Résumé de trois méthodes de feuille de style CSS (avec code)

不言
Libérer： 2018-08-02 16:52:09
original
8697 Les gens l'ont consulté

Quels sont les types de styles CSS ? Les formes d'insertion de code de style CSS peuvent essentiellement être divisées en trois types suivants : en ligne, intégré et externe. Ces trois styles ont des priorités : en ligne > contenu et code spécifiques des trois types de styles CSS.

Remarque : Embedded>Le style externe a un principe : la position du style CSS intégré doit être derrière le style externe. Par exemple, dans l'éditeur de code de droite, le code se trouve devant le code ; code (en fait, ceci est également écrit pendant le développement). Les amis intéressés peuvent l’essayer, inverser leur ordre et voir si leurs priorités changent.

En fait, en général, c'est le principe de proximité (plus on est proche de l'élément à paramétrer, plus la priorité est élevée).

Mais notez que la priorité résumée ci-dessus a un principe : les styles CSS dans les feuilles de style en ligne, intégrées et externes ont le même poids.

1. Feuille de style CSS en ligne

La feuille de style CSS consiste à écrire du code CSS directement dans la balise HTML existante, comme le code suivant : 

<p style="color:red">这里文字是红色。</p>
Copier après la connexion

Attention à l'écrire dans la balise de début de l'élément. L'écriture suivante est erronée : 

<p>这里文字是红色。</p style="color:red">
Copier après la connexion

Et le code de style css doit être écrit entre guillemets doubles s'il y en a. sont plus Plusieurs paramètres de code de style CSS peuvent être écrits ensemble et séparés par des points-virgules. Le code suivant : 

<p style="color:red；font-size:12px">这里文字是红色。</p>
Copier après la connexion
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>认识html标签</title>
<style type="text/css">
span{
   color:red;
}
</style>
</head>
<body>
    <p>php中文网，<span style="color:blue">一级棒的网站</span>、教程,手册,视频,mysql,免费php在线学习平台；<span>资源免费</span>，内容专业、<span>讲师专业</span>。专注让你成为php高手！</p>
</body>
</html>
Copier après la connexion

2. Feuille de style CSS intégrée

Le style CSS intégré signifie que vous pouvez écrire le code de style CSS dans < ;style type="text/css"> entre les balises . Par exemple, le code suivant définit le texte des trois balises en rouge : 

<style type="text/css">
span{
color:red;
}
</style>
Copier après la connexion

Le style CSS intégré doit être écrit entre , et en général Le style CSS intégré est écrit entre . Comme le code dans l'éditeur de droite. 

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>嵌入式css样式</title>
<style type="text/css">
span{
   color:blue;
}
</style>
</head>
<body>
    <p>php中文网，<span style="color:blue">一级棒的网站</span>、教程,手册,视频,mysql,免费php在线学习平台；<span>资源免费</span>，内容专业、<span>讲师专业</span>。专注让你成为php高手！</p>
</html>
Copier après la connexion

3. feuille de style CSS externe

Le style CSS externe (également appelé style externe) consiste à écrire le code CSS dans un fichier externe séparé, ce CSS Le fichier de style a ".css" comme extension et la balise est utilisée dans la balise (et non dans la balise