Contient des sé...LOGIN

Contient des sélecteurs (descendants)

Contient un sélecteur, c'est-à-dire l'ajout d'espaces, qui est utilisé pour sélectionner les éléments descendants sous l'élément tag spécifié. Par exemple, le code dans l'éditeur de code à droite :

.first span{color:red;}

Cette ligne de code rendra le premier paragraphe de texte "lâche comme la couleur de la police "Rat", passe au rouge.

Veuillez noter la différence entre ce sélecteur et un sélecteur enfant. Un sélecteur enfant ne fait référence qu'à ses descendants directs, ou vous pouvez le comprendre comme les descendants de première génération qui agissent sur les éléments enfants. Le sélecteur descendant agit sur tous les éléments descendants enfants. Les sélecteurs descendants sélectionnent avec des espaces, tandis que les sélecteurs enfants sélectionnent avec ">".

Résumé : > Agit sur les descendants de première génération de l'élément, et les espaces agissent sur tous les descendants de l'élément.


section suivante
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>后代选择器</title> <style type="text/css"> .first span{color:red;} .food>li{ border:1px solid red;/*添加边框样式(粗细为1px, 颜色为红色的实线)*/ } </style> </head> <body> <p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p> <ul class="food"> <li>水果 <ul> <li>香蕉</li> <li>苹果</li> <li>梨</li> </ul> </li> <li>蔬菜 <ul> <li>白菜</li> <li>油菜</li> <li>卷心菜</li> </ul> </li> </ul> </body> </html>
soumettreRéinitialiser le code
chapitredidacticiel