28172 sujets

CSS et mise en forme, CSS3

[Résolu] Colorisation de menu

Bonjour
la question peut etre simpliste mais je bloque serieusement dessus
je n'arrive pas a trouver la class ou div qu'i faut créer ou modifier pour changer le menu, plus precisemment le sous menu lors du rroll over
Merci de votre aide
Nadege
#nav {
 
    height: 59px;
 
    float: right; 

    list-style-type: none;
 
    margin: 0;
 
    padding: 30px 120px 0 0;
 
        text-transform: uppercase;
 
        z-index:500;
 
  }
 


   #nav li { 

      float: left;
 
      margin: 0;                

          width:127px;
 
      padding: 0 15px 0 0;
 
      text-decoration: none;
 
      list-style: none;
 
   }
 


   ul .a{
 
    display: block;
 
    margin: 0;
 
    padding: 0;
 
    width: 127px;
 
   }
 
   ul .sc{
 
    display: block;
 
    margin: 0;
 
    padding: 0;
 
    width: 127px;
 
   }
 
   li.sc,li.a,li.sca {
 
       position: relative;
 
       width: 127px;
 
   }
         li .current{
                 background-color:#FFF;
                 color:#9f4705;
         }
    #nav li a {
 
        background-color:#292e31;
 
        color: #FFF;
 
        font-size: 14px;
 
                font-weight:bold;
 
        display: block;
 
        height: 59px;
 
                text-decoration:none;
 
                padding: 10px 0 0 5px;
 
  }
 
   #nav li a:hover {
 
        background-color:#879096;
 
        color: #9f4705;
 
        font-size: 14px;
 
                font-weight:bold;
 
                text-decoration:none;
 
  }
 
 



<ul id="nav">
 <li class="c ">
 <a href="page_article.php?id=30">HISTO</a>
 </li>
 <li class="c ">
 <a href="">Optique</a>
 <ul class="sc" >
 <li class="sc">
 <a href="">optic 2000</a>
 <ul class="sca" >
 <li class="sca ">
 <a href="page_article.php?id=31">optic 2001</a>
 </li>
 </ul>
 </li>
 <li class="sc">
 <a href="">deuxieme ss cat</a>
 <ul class="sca" >
 <li class="sca ">
 <a href="page_article.php?id=32">2eme ss cat article</a>
 </li>
 </ul>
 </li>
 </ul>
 </li>
 <li class=" current">
 <a href="page_article.php?id=33">ANALYSE </a>
 </li>
 <li class="c ">
 <a href="page_article.php?id=28">elec</a>
 </li>
 </ul>
bjr
en fait je souhaite pouvoir changer les couelurs...des parties <li class="sc"> et dessous
mais je n'y arrive pas
ca prends le formatage de #nav li les class sont pas prises en compte
merci
Bonjour
je reviens avec ce sujet car je ne comprends tjrs pas mon probleme
pourquoi dans mon code le .nav li a prends le desssus sur le . current a car c'est le background du .nav li a qui s'affiche.

<ul id="nav">
 <li class="current">
       <a href="#">test</a>
 </li>
</ul>


merci de votre aide
Modérateur
Il existe des règles qui définissent les priorités dans les css.

Voici un article plus tout neuf mais qui traite bien du sujet: http://openweb.eu.org/articles/cascade_css/

Sinon, en gros, plus ta règle est précise plus elle sera prioritaire. Une manière simple de procéder est de prendre la règle que tu veux supplanter, et y ajouter ta règle supplémentaire.


#nav li { 
  /* machins et trucs */
}
#nav li.current { 
  /* machins et trucs, mais plus précis ^^ */
}
Sujet clos
Aller à