- communauté
- Apprendre
- Bibliothèque d'outils
- Loisirs
Maison > Questions et réponses > le corps du texte
J'ai créé des classes pour les éléments de menu afin de pouvoir les appeler.
.dropdownBox {
display: none;
}
.dropdown li:hover > ul.dropdownBox {
display: block;
}
Cependant, l'état de défilement "fonctionnel" avec la classe .dropdown affiche désormais les éléments de sous-menu avec la classe .dropdownBox
<nav class="screen2_menu_container">
<label for="screen2_menu_check" class="screen2_menu_btn">
<!-- checkbox to track when the hamburger menu is clicked on -->
<input type="checkbox" id="screen2_menu_check" class="screen2_input" />
<!-- the hamburger menu -->
<div class="screen2_menu_hamburger"></div>
<!-- menu items -->
<ul class="screen2_menu_items navPositionRight" id="screen2_menu_items">
<a href="CONTACT-US" rel="history"><span>> CONTACT</span></a>
</ul>
<ul
id="screen2_menu_items_Nav"
class="screen2_menu_items navPositionLeft"
>
<li>
<a href="HOME" rel="history"><span>> HOME</span></a>
</li>
<li class="dropdown">
<a href="WORK"><span>> WORK</span></a>
</li>
<ul class="dropdownBox">
<li>
<a href="WORK-1"><span>WORK-1</span></a>
</li>
<li>
<a href="WORK-2"><span>WORK-2</span></a>
</li>
<li>
<a href="WORK-3"><span>WORK-3</span></a>
</li>
</ul>
<li>
<a href="REEL"><span>> REEL</span></a>
</li>
<li class="hideDiv">
<a href="CONTACT-US" rel="history"><span>> CONTACT</span></a>
</li>
</ul>
</label>
</nav>
J'essaie d'utiliser la classe .dropdown pour qu'elle affiche la classe .dropdownBox lorsque vous la survolez, mais je n'arrive pas à faire fonctionner le bon sélecteur.
P粉2810894852024-04-05 00:38:54
Mettez simplement à jour votre CSS. J'espère que cela vous sera utile.
.dropdownBox {
display: none;
}
.dropdown:hover + .dropdownBox {
display: block;
}
.dropdownBox:hover {
display: block;
}