Bonjour ou bonsoir

Je suis en train de faire un site pour un de mes cours, et j'ai des problèmes avec mon menu déroulant (pourtant j'ai lu plusieurs tutos, je n'arrive pas à comprendre et savoir comment on fait)

Je voudrais avoir un menu, qui indique les parties et qui affiche de manière verticale les autres liens

Mon html : 

  <div class="ancres">
        <ul class="menu_verti">
            <li><a href="#">métiers du Design</a></li>
                <ul><li><a href="#Directeur Créatif">Directeur Créatif</a></li>
                    <li><a href="#Game Designer">Game Designer</a></li>
                    <li><a href="#Level Designer">Level Designer</a></li>
                </ul>
            <li><a href="#">métiers du Graphisme</a></li>
                <ul>
                    <li><a href="#Directeur Artistique">Directeur Artistique</a></li>
                    <li><a href="#Graphiste">Graphiste 2D/3D</a></li>
                    <li><a href="#Animateur">Animateur</a></li>
                </ul>
            <li><a href="#">métiers de la Technologie</a></li>
                <ul>
                    <li><a href="#Directeur Technique">Directeur Technique</a></li>
                    <li><a href="#Programmmeur moteur">Programmeur Moteur</a></li>
                    <li><a href="#Programmeur gameplay">Programmeur Gameplay</a></li>
                </ul>
            <li><a href="#Testeur">Testeur</a></li>
        </ul>
    </div> 

et j'ai déjà réussi a comprendre le début du CSS qui a donné ca :

.ancres{
	color: blue;
	float: left;
	border-style: solid white;
	box-shadow: 4px 6px 10px white;
	width: 175px;
	position: fixed;
	padding-bottom: 20px;}

.menu_verti, .menu_verti ul {
	padding:0;
	margin:0;
	list-style:none;
	width: 180px; /* seule ligne rajoutée */
}
.menu_verti li {
	background:none;

}
.menu_verti a {
	display:block;
	text-decoration: none;
	color: blue;
	padding-top: 10px;
	padding-left: 3px;
}

.menu_verti ul {
	position: absolute;
	left:-999em;
}
.menu_verti li:hover ul {
	top: 0;
	left: 180px;
}

Mais je n'ai absolument pas compris comment insérer les liens href="#" et les faire apparaître.

Pourriez vous m'aider ?  (je ne suis vraiment pas douée en html/css xD)

Peut être que ce passage t'aidera

https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3/creer-des-liens#/id/r-1604608

exen a écrit:

Peut être que ce passage t'aidera

https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3/creer-des-liens#/id/r-1604608

enfaite, j'ai compris comment faire les liens.

Mais le problème est comment en faire un menu déroulant, pour faire afficher les liens menant aux "metiers du design", "graphisme" et techniques

Ça viens de la balise </li> de ton titre elle doit se trouver en dessous de ton sous menu pour l'englober

un peut comme ça

<li><a href="#">métiers du Design</a>
   <ul>
     <li><a href="#Directeur Créatif">Directeur Créatif</a></li>
     <li><a href="#Game Designer">Game Designer</a></li>
     <li><a href="#Level Designer">Level Designer</a></li>   
   </ul>
</li>

Ici tu en vois un peut plus

https://openclassrooms.com/courses/creer-un-menu-horizontal-deroulant-en-css

-
Edité par exen 3 janvier 2018 à 23:57:59