Les thèmes pour NPDS

(1250 mots dans ce texte )  -   lu : 3096 Fois    

Démo

• Accueil
• Membres
  • Connexion
  • Inscription
  • Déconnexion
  • Votre profil
• News
  • Nouvelles
  • Rubriques
  • Sujets actifs
  • FAQ
  • Downloads
• Plus
  • Forum
  • Liens
  • Nous contacter

Code html (A ajouter dans header.html de votre thème par exemple)

    

        Accueil
    
        
	
    

        Membres
    

		
Connexion
        
Inscription
						
        
Déconnexion
        
Votre profil
					
    
    
  
	
    

        News
    

		
Nouvelles
        
Rubriques
        
Sujets actifs
        
FAQ
        
Downloads
    
    
   
	
    

    Plus
    

        
Forum
        
Liens
        
Nous contacter
        
    
       

Code CSS (A ajouter de le fichier css de votre thème)

/* Menu déroulant - horizontal*/
#menu {
	padding : 0; /* pas de marge intérieure */
	margin : 5px 0px 5px 0; /* marges de 5 pixel en haut en bas */
	list-style : none; /* Pas de puce */
	line-height : 25px; /* définit une hauteur pour chaque élément */
	font-weight : bold; /* texte en gras */
	font-family : Arial;
	font-size : 12px; /* hauteur du texte : 12 pixels */	
}
#menu ul { /* Liste */     
	padding : 0; /* pas de marge intérieure */
	margin : 0; /* ni extérieure */
	list-style : none; /* Pas de puce */
	line-height : 25px; /* définit une hauteur pour chaque élément */
}
#menu a { /* Contenu des listes */
	display : block; /* Les liens deviennent des balises de type block */
	padding : 0; /* pas de marge intérieure */
	color : #000000; /* couleur du texte */
	border: 1px solid #000000; /* bordure noire complète */
	text-decoration : none;
	background: url('images/5.jpg'); /* image de backgound*/
}
#menu a:hover { /* Contenu des listes */
	background: url('images/6.jpg'); /* image de backgound au survol*/
	color : #8e8e8e; /* couleur du texte */
}
#menu li { /* Éléments des listes */      
	float : left; /* Elements se suivant à gauche */
	width : 120px; /* largeur cellules */
	text-align:left; /* text aligné à gauche*/
	text-indent: 5px; /* Indentation du texte de 5 pixels (décalage du texte à gauche  */
}
#menu li ul { /* Sous-listes */
	position: absolute; 
	width: 120px; /* largeur cellules */
	left: -999em;
	z-index: 30; /* Permet de ne pas cacher le sous-menus, en cas de superposition de calques */
}
#menu li ul a { /* Sous-listes */
	background: url('images/7.jpg'); /* image de backgound au survol*/
}
#menu li ul a:hover { /* Sous-listes */
	background: url('images/8.jpg'); /* image de backgound au survol*/
	color: #ffffff;
}
#menu li ul ul {
	margin: -25px 0 0 120px; /* décalage du sous-menu */
}
#menu li:hover ul ul, #menu li.sfhover ul ul {
	left: -999em;
}
#menu li:hover ul, #header_menu li li:hover ul, #header_menu li.sfhover ul, #header_menu li li.sfhover ul {
	left: auto;
	min-height: 0;
}
#menu img{ /* Images des listes */      
	padding-right: 5px; /* Marge de l'image à droite de 5 pixels  */
	border:0;
	vertical-align:middle; /* Alignement des images au milieu par rapport au texte  */
	width: 19px; /* Largeur des images  */
	height:19px; /* Hauteur des images  */
}

Pour toutes questions: Forum

fouineur 2

Posté : 29-07-2015 22:04 Bonsoir, Merci pour le menu fonctionnel nickel. Juste un détail, un petit téléchargement avec les images aurait été pas mal. Un grand merci pour tout   Profil  www