11 janvier 2010

Afficher des puces dans les sous-menus

Le sélecteur correspondant à l'affichage des puces dans les sous-menus est navlinks ul.
Par défaut, il est réglé pour ne rien (none) afficher :

.navlinks ul {
          list-style-type: none;
}

On peut facilement afficher de petites images en remplaçant simplement la valeur none par :

disc pour un disque plein,
circle pour un disque creux
ou square pour un carré.

On peut en afficher d'autres en remplaçant list-style-type par list-style-image. Exemple :

.navlinks ul {
          list-style-image: url(URL de l'image);
}

article_puce 
exemple de liste avec une puce-image

L'image choisie pour servir de puce doit être très petite, pas plus de 20 pixels de côté.

article_puce2 
exemple de puce-image (22px x 20px)

Posté par Michal53 à 09:30 - - Commentaires [2] - Permalien [#]
Tags : , , , , , ,



Commentaires :

    Merci de mettre ces petites fantaisies, je les avais déjà sur mon blog mais ça peut servir aux autres. Bonne journée Bisous Chantal

    Posté par Aziyadé, 11 janvier 2010 à 09:43 | | Répondre
  • Et bien voilà

    ce que je cherchais voici peu de temps. Je n'ai plus qu'à mettre en oeuvre.
    Merci et à bientôt.
    jackie

    Posté par Jackie, 11 janvier 2010 à 09:46 | | Répondre
Nouveau commentaire