Maison  >  Article  >  interface Web  >  À propos de l'utilisation du signe supérieur à dans les styles CSS et de la méthode d'héritage en CSS

À propos de l'utilisation du signe supérieur à dans les styles CSS et de la méthode d'héritage en CSS

不言
不言original
2018-06-14 10:27:211943parcourir

L'héritage apporte certains problèmes à nos programmes, nous devrions donc étudier sérieusement les principes de l'héritage. Voici un bon exemple, une méthode de gestion de l'héritage peut se référer à

Héritage Dans une certaine mesure, cela rend le programme plus pratique dans le processus d'écriture, mais parfois cela apporte également certains problèmes à notre programme, il est donc important d'étudier attentivement les principes de l'héritage et comment y faire face. Ce qui suit est une façon de gérer l’héritage en CSS.

J'ai vu un signe supérieur à (>) dans un morceau de code CSS. Le code est le suivant :

BODY#css-zen-garden > p#extrap2 { 
BACKGROUND-IMAGE:url(../images/bg_face.jpg); 
Z-INDEX: 2; 
POSITION: fixed; 
WIDTH: 205px; 
BOTTOM: 0px; 
BACKGROUND-REPEAT: no-repeat; 
BACKGROUND-POSITION: left bottom; 
HEIGHT: 594px; 
LEFT: 0px 
}

Que signifie le signe supérieur à en CSS ?

Exemple : Il existe une couche p contenant plusieurs balises span, le code est le suivant :

<p> 
<span>亲人</span> 
<span>独家记忆</span> 
<span>离不开你</span> 
</p>

Utiliser CSS à cette fois, le style doit être défini comme ceci :

p span { 
font:10px; 
color:blue; 
}

Mais à ce stade, la première balise span doit être affichée dans différents styles, et la deux derniers 45a2772a6b6107b401db3c9b82c049c2 Le style de l'étiquette reste inchangé, que dois-je faire ? Est-il acceptable de mettre le premier span dans une balise p ? Le code est le suivant :

<p> 
<p> 
<span>亲人</span> 
</p> 
<span>独家记忆</span> 
<span>离不开你</span> 
</p>

Malheureusement, cela n'est pas possible car le style p span {...} s'applique à toutes les balises span sous le p layer Fonction, qu'il s'agisse d'une balise enfant ou d'une balise petit-enfant, donc le style fonctionne toujours. À l'heure actuelle, le "signe supérieur à" en CSS est utilisé.

Changeons maintenant ce style. Le code est le suivant :

p > span { 
font:10px; 
color:blue; 
}

De cette façon, la première balise span peut être connectée. les deux autres affichent des styles différents. On peut donc savoir que la fonction du "signe supérieur à" en CSS est la suivante : dans les balises imbriquées, le style ne s'applique qu'aux balises de la génération fils, pas aux balises de la génération petit-enfant.

Mais il existe toujours une telle situation, le code suivant :

<p> 
<span>亲人 
<span>丁当</span> 
</span> 
<span>独家记忆</span> 
<span>离不开你</span> 
</p>

A ce moment, le "signe supérieur à" sera ça marche toujours ? La réponse est : non. Parce que la balise span de ce petit-enfant hérite du style de balise span du fils.

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Analyse de l'utilisation héritée en CSS

Remplacement des règles des styles 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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn