1. ⭐⭐⭐ Grosse PROMO en cours sur ma plateforme SEO My Ranking Metrics
    Rejeter la notice

(CSS) diffréntes couleur pour liens menu

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par Antoyz, 18 Janvier 2012.

  1. Antoyz
    Antoyz Nouveau WRInaute
    Inscrit:
    18 Janvier 2012
    Messages:
    1
    J'aime reçus:
    0
    Bonjour, je suis novice et j'ai besoin pour ce site : http://www.videoboutique.fr de personnaliser la couleur des liens du menu selon la page. En gros quand je passe ma souris sur CAD par exemple je voudrai que le mot "CAD" soit rose et ainsi de suite pour les autres avec une autre couleur ... et une fois que l'on est sur la page que la couleur reste comme actuellement sauf que là c'est jaune pour tous ...
    Pour info je suis sous wordpress et c'est un thème que j'ai totalement modifié mais là je bloque :)

    voici le css concerné (enfin je pense que cela ce passe par ici ^^)

    Code:
    /* The page Body */
    body { color: #494949; }
    
    /* Headings */
    h1, h2, h3, h4, h5, h6 { color: #ed008c; }
    h3, h4 { border-bottom: 1px solid #d6d6d6; }
    
    /* Links */
    a { color: #edbe00; }
    
    /* Menu */
    .menu a { color: #ccc; }
    .menu ul li a:hover,
    .menu ul li.current_page_item a,
    .menu ul li.current_page_parent a,
    .menu ul li.current_page_ancestor a,
    .menu ul li.current-menu-item a,
    .menu ul li.current-menu-ancestor a { color: #edbe00; }
    
    .menu { background: transparent url('menu_bg.gif') repeat-x scroll center top; }
    
    .nav > li > a, 
    .nav > li > a:focus { background: transparent url('menu_separator.gif') no-repeat scroll left top; }
    .nav > li:first-child > a { background: none; } 
    
    .nav ul { border-top: 1px solid #494949; }
    .nav ul li a { border-bottom: 1px solid #494949; background-color: #333; border-left: 1px solid #494949; border-right: 1px solid #494949; color: #bbb; text-shadow: 1px 0px 1px #000; }
    
    .nav a:hover { background-color: transparent; }
    .nav li:hover, .nav li.nav-hover,
    .nav a:focus { background: transparent; }
    
    .nav ul a:hover { background-color: #555; color: #edbe00 !important; }
    .nav ul li:hover, .nav ul li.nav-hover,
    .nav ul a:focus { background: #555; }
    .nav li.current_page_item ul a,
    .nav li.current_page_ancestor ul a,
    .nav li.current_page_parent ul a,
    .nav li.current-menu-item ul a,
    .nav li.current-menu-ancestor ul a { color: #bbb !important; }
    .nav li.current_page_item ul a:hover,
    .nav li.current_page_ancestor ul a:hover,
    .nav li.current_page_parent ul a:hover,
    .nav li.current-menu-item ul a:hover,
    .nav li.current-menu-ancestor ul a:hover { color: #edbe00 !important; }
    Merci de votre aide ! :D

    Anthony
     
  2. lambi521
    lambi521 WRInaute passionné
    Inscrit:
    15 Juin 2010
    Messages:
    1 476
    J'aime reçus:
    0
    Soit tu charges une feuille CSS différente selon la page dans laquelle tu te trouves, soit tu met ton CSS dans ta page PHP et tu défini tes couleurs dans des variables qui se modifie selon $_GET['REQUEST_URI'] par exemple. Ou alors en javascript peut-être mais ça c'est une autre histoire
     
  3. zeb
    zeb WRInaute accro
    Inscrit:
    5 Décembre 2004
    Messages:
    12 196
    J'aime reçus:
    1
    Tu peu aussi interpréter avec php le script CSS et y glisser du code dedans.
     
  4. lambi521
    lambi521 WRInaute passionné
    Inscrit:
    15 Juin 2010
    Messages:
    1 476
    J'aime reçus:
    0
    Oui c'est le mieux je pense mais je n'ai jamais approfondi le sujet, je voulais le faire à un moment sur un site mais j'ai laissé tomber finalement. Je sais qu'ils le font sur www . e - consommables . fr, essaies de regarder leur code
     
  5. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    8 808
    J'aime reçus:
    242
    Allez une piste, WP ajoute un identifiant unique à chaque item du menu, pour l'item CAD, c'est #page-item-11.
     
Chargement...
Similar Threads - (CSS) diffréntes couleur Forum Date
Centrer verticalement un texte (CSS) Développement d'un site Web ou d'une appli mobile 16 Février 2012
Référencement avec Sprites (CSS) ? Débuter en référencement 16 Août 2010
  1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
    Rejeter la notice