Forum Crea illusion Fantasy
A quoi sert le forum ?
Ce forum est liée à mon site Crea illusion Fantasy. Un plus pour vous aidez dans vos créations.Vous ne savez pas créer, et vous recherchez une création personnalisée. Le forum vous écoutera vos demandes.
Plusieurs sections :
Des aides: pour votre forum,votre site ou blog.Des tutoriels(photoshop,paintshop,gimp,photofiltre,ect...).Demandes de créations personnalisées. Aide pour prendre en main vos logiciels.Des tutos, des scripts. aides pour le logiciel Flash..... Des concours, des challenges, des duels. Vous y trouverez un accueil sympathique.
Au plaisir de vous lire sur le forum. D'autres choses à venir découvrir sur le forum de Créa illusion Fantasy.

N'hésitez pas à venir vous inscrire.


Aides & Conseils pour le graphisme & forum & site web & blog & tout autres supports.
 
AccueilPortailFAQPublicationsPublicationsS'enregistrerConnexion
Votre bannière ici,Faite la demande dans la catégorie: La place Public


Partagez | .
 

 Petit menu en couleur

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Ptite_Perle
Admin


avatar


Messages : 6726
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 53
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 8990

MessageSujet: Petit menu en couleur   Mer 3 Mai - 20:52


Voici un petit menu toutes en couleurs

Le Code CSS:
Code:
@charset "iso-8859-1";
*{/* reset */margin:0;padding:0;}

body{font-size:14px;color:#666;background:#111 no-repeat;
 /* CSS3 Dégradé circulaire */
 background-image:-moz-radial-gradient(0 -100px 45deg, circle farthest-corner, #444 150px, #111 300px);
 background-image:-webkit-gradient(radial, 50% 0, 150, 50% 0, 300, from(#444), to(#111));

 font-family:Arial, Helvetica, sans-serif;}

#navigationMenu li{ list-style:none;height:39px;padding:2px;width:40px;}
#navigationMenu span{
 /* Propriétés deu conteneur*/
 width:0; left:38px; padding:0; position:absolute; overflow:hidden;
 /* Propriétés du texte */
 font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
 font-size:18px;font-weight:bold;letter-spacing:0.6px;white-space:nowrap;line-height:39px;
 /* Transition: */
 -webkit-transition: 0.25s;
 -moz-transition: 0.25s;
 transition: 0.25s;
}

#navigationMenu a{background:url('../img/navigation.jpg') no-repeat;height:39px;width:38px;display:block;position:relative;}
/* Propiétés du survol */
#navigationMenu a:hover span{ width:auto; padding:0 20px;overflow:visible; }
#navigationMenu a:hover{text-decoration:none;
/* Propriétés de l'ombre */
 -moz-box-shadow:0 0 5px #9ddff5;
 -webkit-box-shadow:0 0 5px #9ddff5;
 box-shadow:0 0 5px #9ddff5;
}
/* en cas d'ajout de bouton, faites correspondre les coordonnées de la position, la couleur etc... */
/* le nom doit correspondre au navigationMenu.xxxxx */
/* Bouton vert */
#navigationMenu .accueil { background-position:0 0;}
#navigationMenu .accueil:hover { background-position:0 -39px;}
#navigationMenu .accueil span{background-color:#7da315;color:#3d4f0c;text-shadow:1px 1px 0 #99bf31;}
/* Bouton bleu */
#navigationMenu .about { background-position:-38px 0;}
#navigationMenu .about:hover { background-position:-38px -39px;}
#navigationMenu .about span{background-color:#1e8bb4;color:#223a44;text-shadow:1px 1px 0 #44a8d0;}
/* Bouton orange */
#navigationMenu .scripts { background-position:-76px 0;}
#navigationMenu .scripts:hover { background-position:-76px -39px;}
#navigationMenu .scripts span{background-color:#c86c1f;color:#5a3517;text-shadow:1px 1px 0 #d28344;}
/* Bouton jaune */
#navigationMenu .images { background-position:-114px 0;}
#navigationMenu .images:hover{ background-position:-114px -39px;}
#navigationMenu .images span{background-color:#d0a525;color:#604e18;text-shadow:1px 1px 0 #d8b54b;}
/* Bouton violet */
#navigationMenu .contact { background-position:-152px 0;}
#navigationMenu .contact:hover { background-position:-152px -39px;}
#navigationMenu .contact span{background-color:#af1e83;color:#460f35;text-shadow:1px 1px 0 #d244a6;}
/* Utile uniquement dans la page de demo */
#main{margin:80px 50px;position:relative;width:40px;}
h1{margin: auto 20px;color:#fff;font-size:30px;font-weight:normal;padding:60px 0 20px;font-family:"Myriad Pro",Arial,Helvetica,sans-serif;}


L'exemple:


Fermé:
[Vous devez être inscrit et connecté pour voir cette image]

Ouvert:
[Vous devez être inscrit et connecté pour voir cette image]

Les images:

[Vous devez être inscrit et connecté pour voir cette image]
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
 

Petit menu en couleur

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Comment changer la couleur de fond du menu deroulant couleur de police
» Menu déroulant - Couleur du titre
» Petit problème de couleur
» Petit problème de couleur
» Petit soucis de couleur (Nom d'utilisateur et Chatbox)

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum Crea illusion Fantasy  :: Sites web-