Création de sous-menu

Fermé
Hgt - Modifié par Hgt le 29/06/2016 à 19:42
telliak Messages postés 3655 Date d'inscription mercredi 20 septembre 2006 Statut Membre Dernière intervention 27 mars 2024 - 30 juin 2016 à 18:03
Bonjour, je souhaite ajouter des sous menu à mes catégorie (véhicule par exemple au moment ou je survole avec mon pointer la catégorie véhicule s'ouvre) , comment puis-je faire? merci d'avance pour votre réponse.

</head>

<body>
<ul><li>Accueil</li>
  <li>Déposer une annonce</li>
  <li>
    Toutes les catégories
    <ul>
      <li>Emploi</li>
      <a>offres d'emploi</a>
      <li>Immobilier</li>
      <gras>Ventes Immobilières (sous menu)</gras>
<gras>      Locations immobilières (sous menu)
</gras>      <li>Véhicules</li>
      Voiture (sous menu)
      Moto (sous menu)
      Caravaning
      <li>Vacances</li>
      <li>Multimédia</li>
      Informatique
      Consoles et jeux vidéo
      Image et son
      Téléphonie
      <li>Loisirs</li>
      <li>Matéril professionnel</li>
      <li>Services</li>
      <li>Maison</li>
      <li>Autres</li>
    </ul>
  </li>
  <li>A propos</li>
  <li>Se connecter</li>
</ul>
</body>
</html>



body {
  font-family: 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  padding: 20px 50px 150px;
  font-size: 13px;
  text-align: center;
  background: #F2F2F2;
}

ul {
  text-align: left;
  display: inline;
  margin: 0;
  padding: 15px 4px 17px 0;
  list-style: none;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
ul li {
  font: bold 12px/18px sans-serif;
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 15px 20px;
  background: #FAFAFA;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
ul li:hover {
  background: #555;
  color: #fff;
}
ul li ul {
  padding: 0;
  position: absolute;
  top: 48px;
  left: 0;
  width: 158px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
ul li ul li { 
  background: #555; 
  display: block; 
  color: #fff;
  text-shadow: 0 -1px 0 #000;
}
ul li ul li:hover { background: #444; }
ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}
A voir également:

2 réponses

telliak Messages postés 3655 Date d'inscription mercredi 20 septembre 2006 Statut Membre Dernière intervention 27 mars 2024 875
29 juin 2016 à 21:31
Salut,
Honnêtement, tu fais une simple recherche avec Création de sous-menu html par exemple et tu as une masse de tutos pour te satisfaire.
0
Oui, avant de poster ma question j'ai fait des recherche mais j'ai pas réussi à faire des sous-sous menus.
0
telliak Messages postés 3655 Date d'inscription mercredi 20 septembre 2006 Statut Membre Dernière intervention 27 mars 2024 875
30 juin 2016 à 18:03
T'as pas dû aller chercher loin, voilà un exemple (je n'ai pas vérifié le code proposé).
Qu'est-ce qui te coince ? Un sous-sous-menu n'est qu'un sous-menu de sous-menu et se traite de la même façon que le sous-menu.
0
Salut,

la question est pas très claire ni précise.
Pour l'instant vous avez une page (statique) en HTML et CSS.

Ce n'est pas clair ni précis parce quand vous parlez de catégories et de sous menu si ça correspond à votre réflexion pour présenter des documents le plus simple et efficace est de faire une page par contenu.

Si vous parlez de leur organisation dans des bases de données et qu'il faut pouvoir rajouter, supprimer, modifier des catégories(bref un site qui devient pas inutile au moindre changement nécessaire) il faut une base de données et un programme pour faire la liaison avec la page web.

Si vous parlez de l'affichage de menus déroulant 'est possible avec CSS
https://www.google.fr/search?q=menu+déroulant+css

Pour pouvoir intervenir sur le contenu de la page de façon interactive(que les choses changent en fonction d'une action de l'utilisateur ou autre) il faudra soit ce type de sites(dynamiques) dont les informations sont indiquées(et modifiées) sur la base de données, soit au moins un peu de javascript comme ceci:

http://www.w3schools.com/jsref/prop_html_innerhtml.asp

Qui comme vous en avez peut être entendu parler est un langage de programmation donc permet notamment de manipuler les balises et leur contenu ainsi que le CSS.
0