communauté
Apprendre
Bibliothèque d'outils
Outils d'IA
Loisirs
recherche
Français
Maison interface Web Questions et réponses frontales Quel attribut de CSS3 modifie la propriété en cascade ?

Quel attribut de CSS3 modifie la propriété en cascade ?

青灯夜游
青灯夜游
Jan 13, 2022 pm 02:50 PM
css3

En CSS3, vous pouvez utiliser la règle "!important" pour modifier la nature en cascade. Cette règle est utilisée pour augmenter le poids du style spécifié, modifiant ainsi la nature en cascade du style. La syntaxe est "sélecteur {attribut : valeur !important;}".

Quel attribut de CSS3 modifie la propriété en cascade ?

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Qu'est-ce que l'empilabilité ?

La cascade est une fonctionnalité des navigateurs qui gèrent les conflits. Si un attribut est défini sur le même élément via plusieurs sélecteurs, un seul sélecteur prendra effet à ce moment-là et les autres sélecteurs seront désactivés.

Définition : Le même sélecteur définit le même style. À ce stade, l'un des styles remplacera l'autre style en conflit.

Fonction : résolvez le problème du conflit de style.

Principe de cascade : Lorsque des conflits de style surviennent, suivez le principe de proximité.

Incarnation de la cascade CSS :

1 : Aucun conflit de style

/* 多个选择器选择同一个元素，样式并无冲突时 */
.box_one{
    width:100px;
    height:100px;  
}
.box_two{
    background:red;
}
<body>
     <div class="box_one box_two"></div>
</body>
Copier après la connexion

Dans le code ci-dessus, il n'y a pas de conflit dans le code de style. Tous les styles des deux sélecteurs sont superposés sur l'élément div, et le div est. finalement rendu sous la forme d'un conteneur rouge d'une largeur et d'une hauteur de 100 px.

Quel attribut de CSS3 modifie la propriété en cascade ?

2 : Conflit de style

Conflit de style, lorsque le même niveau n'est pas affecté par la priorité 

.box_one{
   width:100px;
   height:100px;
 }
.box_two{
    width:200px;
    background:red;
}
<body>
    <div class="box_one box_two"></div>
</body>
Copier après la connexion

Dans le code ci-dessus, lorsqu'on est au même niveau (le même élément, le même nom de sélecteur de définition de classe), S'il y a un conflit dans le code de style et que le même attribut width apparaît dans les deux sélecteurs, le style qui apparaît en dernier dans le code CSS prévaudra. Le div finira par afficher un conteneur rouge d'une largeur de 200 px et d'une hauteur de 200 px. 100px.

Quel attribut de CSS3 modifie la propriété en cascade ?

Lorsque les styles sont en conflit et que différents niveaux sont affectés par la priorité (poids)

CSS stipule que la priorité des sélecteurs de base est triée de bas en haut comme : élément (balise) style < ) style