L'Auteur du site

Passionné par le web, je suis un JimdoFriend et mets à disposition des tutoriels et astuces pour Jimdo gratuitement.

Rechercher

Sur Facebook

Réseaux sociaux

Retrouvez moi sur Twitter et Google+ également.

Newsletter

[Tutoriel spécial] Design P4031 un menu avec des puces pattes de chien

Style bouton boutique

 

Voilà un petit tutoriel spécial pour le design JimdoPro 4031 (que vous pourrez toujours adapter si vous avez des connaissances en CSS).

 

Ce tuto ajoute une puce patte de chien à chaque onglet du menu principal (Nav1).

 


Menu pattes de chien
Menu pattes de chien


Comme d'habitude, il faut insérer un code dans "Modifier le head" et voilà une image explicative :

Et voici le code :

<style type="text/css">

/*<![CDATA[*/

 

/* Ajouter des pattes de chien au menu */

 

ul.mainNav1 li a, ul.mainNav1 li a:visited

{

background: #B7BC6A url(http://u.jimdo.com/www60/o/s10adc493e4ebb4cd/userlayout/img/nav-chien.png) 0 bottom no-repeat !important

}

 

/*]]>*/

</style>

Écrire commentaire

Commentaires : 4
  • #1

    atoutcanin (jeudi, 10 juillet 2014 20:42)

    Un énorme merci je vous laisse aller regarder votre œuvre je suis vraiment ravis

    http://atoutcanin.jimdo.com/

  • #2

    Ze Tuto (jeudi, 10 juillet 2014 20:54)

    De rien ;)

  • #3

    esprit-malin (jeudi, 29 janvier 2015 22:16)

    ça donne bien!!
    On peut faire pareil avec d'autres images comme puce??

  • #4

    Ze Tuto (lundi, 23 février 2015 14:19)

    @esprit-malin,
    si vous vous y connaissez un peu, vous pouvez changer l'image (j'ai pour cette exemple là, dû repasser l'image du menu avec Photoshop pour intégrer directement la puce patte de chien, mais pas la peine avec un menu plus simple).