Pourquoi utiliser CSS (feuilles de style en cascade)

Aujourd'hui, je vais principalement parler des feuilles de style CSS. Utiliser le HTML en combinaison avec celui-ci peut rendre les pages HTML très colorées !

Tout d'abord, présentons brièvement pourquoi utiliser ＣＳＳ（Cascading Sstyle Sheets) en cascade des feuilles de style !

　1. Parce que les feuilles de style CSS peuvent définir la façon dont les éléments HTML sont affichés

2. Tous les principaux navigateurs prennent en charge les feuilles de style CSS

3. Les feuilles de style sont extrêmement Améliore considérablement l'efficacité du travail

　4. De plus, plusieurs feuilles de style peuvent être regroupées en une seule

Si le même élément HTML est utilisé par plus de 1 Lors de la définition d'un style, quel style sera utilisé ?

De manière générale, tous les styles seront cascadés dans une nouvelle feuille de style virtuelle selon les règles suivantes, parmi lesquelles la 4ème a la priorité la plus élevée.

1. Paramètres par défaut du navigateur

2. Feuille de style externe

3. Feuille de style interne (située à l'intérieur de la balise 93f0f5c25f18dab9d176bd4f6de5d30e)

4. Style en ligne (à l'intérieur de l'élément HTML)

Par conséquent , un style en ligne a la priorité la plus élevée, ce qui signifie qu'il aura priorité sur les déclarations de style suivantes : les déclarations de style dans la balise 93f0f5c25f18dab9d176bd4f6de5d30e et les déclarations de style dans les feuilles de style externes. Déclaration ou déclaration de style du navigateur. (valeur par défaut) !

Voici l'introduction de sa syntaxe :

Il y a deux parties principales de la composition des règles CSS : le sélecteur et une ou plus de déclarations.

1 div{2     width:100px;3     height:100px;4 }

Le sélecteur est généralement l'élément HTML dont vous avez besoin pour changer le style

Chaque déclaration est composée d'un attribut composé d'une valeur. !

La propriété est l'attribut de style que vous souhaitez définir. Chaque attribut a une valeur. L'attribut et la valeur sont séparés par deux points.

Ce qui suit La fonction de cette ligne de code est. pour définir la couleur du texte dans l'élément H1 comme rouge et définir la taille de la police sur 14 pixels

Dans cet exemple, .h1 est le sélecteur, et la couleur et la taille de la police sont les attributs.red et 14px sont les attributs.

h1{
    color:red;
    font-size:14px;
}

L'image ci-dessous vous montre la structure du code ci-dessus :

Différentes méthodes d'écriture. et unités de valeurs :

En plus du mot anglais red, on peut également utiliser la valeur de couleur hexadécimale #ff0000;

p{
    color:#ff0000;
}

On peut utilisez également les valeurs RVB de deux manières :

p{color:rgb(255,0,0);
}p{color:rgb(100%,0%,0%);
}

N'oubliez pas d'écrire des guillemets :

Astuce : Si la valeur est composée de plusieurs mots, ajoutez des guillemets à la valeur ;

p{

　font-family: "sans serif";

}

---

Je serai là aujourd'hui à demain !!!

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!