Forum de support officiel

Forum d'entraide et support officiel des forums Forumprod.com


Heures au format UTC + 1 heure [ Heure d’été ]



Poster un nouveau sujet Répondre au sujet  [ 1 message ] 
Auteur Message
Chef des aideurs
Chef des aideurs
Avatar de l’utilisateur

Inscription: Déc 2011
Messages: 1061
Points: 1293
Localisation: France
Sexe: Masculin
Posté: 23 Mar 2012, 05:13 

Appliquer une couleur au survol de la souris sur les tableaux des forums

Ce petit tutoriel vous explique comment faire apparaitre une couleur sur le fond des tableaux des forums,cette couleur disparait quand la souris quitte la zone.
Si vous avez le moindre doute avec ces codes,que vous pensez faire une faute fatale,pas de panique enregistrez votre feuille de style CSS complète avant sur un bloc-note.


Vous pouvez donc choisir la partie que vous voulez voir en couleur au survol de la souris,
Aidez-vous de cette légende ci-dessous:

Légende:
Image

Couleur 1
(La couleur 1 s'applique comme précisé dans la légende en 1ere partie mais aussi sur le reste des tableaux du forums alors ne choisissez pas une couleur trop claire pour un forum trop foncé etc.. Choisissez la bonne couleur ;) )
Code:
td.row1:hover {
   background-color: #000000;

Couleur2
(Comme précisé dans la légende il y aura deux emplacements pour cette couleur)
Code:
td.row2:hover {
   background-color: #000000;

Couleur3
Code:
td.row3:hover {
   background-color: #000000;

:arrow: Il faut modifier le #000000 par le code couleur(Merci à Skiptonick pour ce site) que vous voulez.

Astuce: Vous pouvez y ajouter un temps de transition pour vos couleurs au survol,pour ce faire rajouter à la suite du/des code(s) que vous avez choisi ce code ci-dessous:
Code:
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;


Où installer les codes?
:arrow: Panneau d'administration :arrow: Style :arrow: Editer la feuille de style CSS
Et copiez vos codes tout à la fin.

Important:
J'ajoute qu'il est très important de baliser vos codes à la fin si vous les incorporez tous,pour ce faire utilisez la balise } exemple: vos codes alignés correctement donnent:
Code:
td.row1:hover {
   background-color: #000000;
}
td.row2:hover {
   background-color: #000000;
}
td.row3:hover {
   background-color: #000000;


En éspèrant que cela vous a été utile ;)


Haut
  Profil 
 

Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités

Modérateur:

Aideurs

Permissions de ce forum:

Vous ne pouvez pas poster de nouveaux sujets
Vous ne pouvez pas répondre aux sujets
Vous ne pouvez pas éditer vos messages
Vous ne pouvez pas supprimer vos messages
Vous ne pouvez pas joindre des fichiers
Poster un nouveau sujet Répondre au sujet  [ 1 message ] 


cron
Créer un forum | © phpBB | Entraide & support | Forum gratuit