Dans le balisage ci-dessous, je cherche un moyen (peut-être utiliser des sélecteurs CSS) pour styler le contenu div différemment en fonction de la présence de menu? Le menu peut être présent ou peut ne pas être présent dans cet emplacement dans le balisage et s'il est là, j'ai besoin d'ajouter une marge supérieure au contenu.
Je crois que les règles de sélecteur et de sélecteur descendant ne peuvent pas aller aussi loin ...
"Lorsque le menu est présent sous la forme d'un enfant d'en-tête, définissez la marge supérieure du contenu (dont le parent est un frère d'en-tête) à 100 pixels. Sinon, réglez-le à zéro" Si CSS a permis aux groupements, je le ferais de cette façon ...
4 Réponses :
impossible dans votre balisage.
Les sélecteurs CSS ne peuvent que regarder l'ancêtre et les axes de fromage. Vous ne pouvez pas regarder à l'intérieur ("quels enfants ai-je") - seulement vers le haut ("Quels sont mes parents") et sur latéralement ("Qu'est-ce qui se trouve à côté de moi"). P>
Exemples. Ceci: p> fait référence à tout ceci: p> fait référence à tout ceci: p> fait référence à tout code> L'un des ancêtres est un code>. p> code> dont direct em> ancêtre (c.-à-d. "Parent") est un code>. p>
Vous pouvez regarder sur latéralement avec des sélecteurs frères
Vous pouvez éventuellement utiliser du JavaScript pour détecter cela. Vérifiez si le menu est sous l'en-tête à la charge, et s'il est, puis définissez la marge du contenu sur 100px
Vous pouvez utiliser jQuery: malheureusement le mais Pourquoi n'appliquez-vous pas simplement un : a () Sélecteur n'a pas trouvé son chemin dans CSS3. margin-bas sur div.menu ?
Le menu est hors du flux (absolument positionné :)
J'essaie de faire de l'espace au-dessus du contenu du menu, qui est absolu positionné dans cet espace. Pas besoin de l'espace si le menu n'est pas présent.
J'ai utilisé ce code CSS dans une mise en forme conditionnelle. Index de format en comptant à partir de la fin.
#stk-service-account-menu ul li:nth-last-child(1):before {
À peu près sûr que vous ne pouvez pas faire cela, mais encore une fois, j'ai vu des règles assez folles CSS.
La seule façon de faire des sélecteurs conditionnels est basé sur des pseudo-classes et des requêtes médiatiques ... C'est assez étonnant ce que vous pouvez faire avec: cible et ancres placées avant les éléments que vous souhaitez sélectionner ou même au début de la page.