Rechercher : dans
Par :

Liens en css

Dernière réponse le 29 jun 2008 à 01:07:10 mazzette, le 14 mai 2007 à 11:15:28 
 Signaler ce message aux modérateurs

Bonjour,
Je suis en train de concevoir un site internet en utilisant une feuille de style CSS
J'ai un petit pb concernant les liens.
En effet, j'ai deux barres de navigations :
- l'une est horizontale : les liens sont en blancs ;
- l'autre est verticale : les liens sont en bleu ;
Mon problème est le suivant :
Je n'arrive pas à trouver le bon code pour que le lien de la page en cours deviennent vert (donc lorsque le lien est actif) et que ce dernier passe Blanc lorsque l'on clique sur un autre lien.
Quelqu'un pourrait il m'aider ?


Voici ce que j'ai fait :

a{
text-decoration: none;
color: #8fbe47;
}

Merci sand

Configuration: Windows XP
Internet Explorer 6.0

Meilleures réponses pour « liens en css » dans :
CSS - Les couleurs Voir Les couleurs Le standard CSS propose différentes façons de définir des couleurs : par un nom avec la notation hexadécimale avec la notation décimale Appel d'une couleur par son nom Le langage HTML définit des noms pour un nombre limité de...
[Word] Supprimer tous les liens hypertextes VoirLorsque vous copiez-collez un extrait d'une page web, vous risquez fort d'obtenir dans le texte de nombreux liens hypertextes. Voici deux solutions pour supprimer les liens hypertextes d'un document Word. 1° solution : un lien hypertexte à la...
ThunderBird - Ouvrir les liens HTTP dans Firefox VoirThunderbird sous Windows Thunderbird sous GNU/Linux Remarques communes à Windows et GNU/Linux Rien de plus agaçant que de devoir copier / coller des liens HTTP depuis un courriel pour pouvoir les voir correctement ! Rien de plus agaçant...
[CSS] Créer facilement des CSS VoirUn outil très facile d'utilisation pour créer des CSS, avec un aperçu en direct de ce que vous créez : TopStyle. La version Lite est gratuite. http://www.topstyle4.com/
Les liens hypertextes VoirPrésentation des ancrages Les liens hypertextes (ancrages) sont des éléments d'une page HTML (soulignés lorsqu'il s'agit de texte) permettant aux internautes de naviguer vers une nouvelle adresse lorsque l'on clique dessus. Ce sont les liens...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Le droit des liens hypertextes VoirIntroduction aux liens hypertextes Les liens hypertextes (parfois appelés pointeurs) sont le moteur de l'interactivité du web. En effet, c'est grâce aux liens qu'il est possible à l'internaute de naviguer entre les pages d'un site, mais également...

1

xjl, le 14 mai 2007 à 11:24:56
  • +4

Salut,

a:link { color: red;} /* lien non-visité */
a:visited { color: white;} /* lien visité */
a:hover { color: yellow;} /* lien survolé */
a:active { color: green;} /* lien activé */

tu peux choisir les lignes qui t'intéressent là-dedans... ;-)

Répondre à xjl

2

mazzette, le 14 mai 2007 à 11:38:20

Merci mais cela ne fonctionne pas .. j'ai déjà essayé et il ne m'affiche pas le lien en vert lorsque je suis sur la page en cours. Il reste blanc sand

Répondre à mazzette

3

xjl, le 14 mai 2007 à 11:41:58
  • +2

Ok, regarde si tu n'appelles pas une feuille css au début de ta page qui spécifierait que tu veux les liens actifs en blanc et qui pourrait provoquer des problèmes d'héritage, ou quelquechose dans le genre...

Répondre à xjl

4

mazzette, le 14 mai 2007 à 11:50:14

Ben dans ma feuille de style externe j'ai :
- la mise en forme de mon menu (classe) : police, taille; mais je n'ai pas mis de couleur
- la mise en forme des liens : voici :

a:visited {
text-decoration: none;
color:#ffffff;
}
a:hover {
text-decoration: none;
color:#8fbe47;
}
a:active {
text-decoration: none;
color:#8fbe47;
}

La couleur verte ne s'affiche que lors du survol
sand

Répondre à mazzette

5

Dalida, le 14 mai 2007 à 13:24:22
  • +4

Salut,

il faut que tu définisse la pseudo classe 'link' de la balise <a>.

a:link{color:green;} 

et surtout il faut respecter l'ordre link, visited, hover, active (pour t'en rappeller : LoVe HAte).
Il y a surement des pandas pour ne dépendre de rien
Et des pourquoi pas qui durent jusqu'à demain

Répondre à Dalida

6

mazzette, le 14 mai 2007 à 14:22:24

Merci pour ta réponse
mais je ne comprends pas ... cé tjrs pareil.. il n me prend pas la couleur verte lorsque je suis sur la page en cours sand

Répondre à mazzette

7

Dalida, le 14 mai 2007 à 17:50:13

Est-ce qu'il n'est pas considéré comme lien visité (vide ton cache pour être sure) ? à mon avis c'est de là que ça vient.

est-ce que le style n'est pas défini dans une balise html (<a> ou <body> pour 'vlink') ?

mais surtout, as-tu une version en ligne ?

Il y a surement des pandas pour ne dépendre de rien
Et des pourquoi pas qui durent jusqu'à demain

Répondre à Dalida

8

Gihef, le 14 mai 2007 à 18:19:28
  • +2

Bonjour,

En fait, il me semble que ce tu essaies de faire n'est pas possible en CSS.

“que le lien de la page en cours deviennent vert”
Or, a:active ne correspond pas à ça :
• La pseudo-classe :active… est appliquée quand l'utilisateur active un élément. Par exemple, entre le moment où l'utilisateur presse le bouton de la souris et le relâche.


+ Salut Dalida.
 

Répondre à Gihef

9

Dalida, le 14 mai 2007 à 20:11:09

Salut Gihef !

mais avec ':link' et ':visited' colorés en vert il devrait s'afficher en vert sauf lorsque le lien est déjà visité puisque elle le colore en blanc.

enfin c'est que j'en ai compris. je ne crois pas que mazette voulais utiliser ':active'.

bref… le meilleur moyen pour se comprendre est encore d'attendre sa version des choses !

à plus tout le monde !

Il y a surement des pandas pour ne dépendre de rien
Et des pourquoi pas qui durent jusqu'à demain

Répondre à Dalida

10

mazzette, le 15 mai 2007 à 14:41:49

Bjr à tous,
Non je n'ai pas de version en ligne

En effet, je souhaiterais que le lien de la page en cours devienne vert. Mais apparemment ce n'est pas possible en css.. enfin presque puis que j'ai trouvé une parade mais une fois sur la page en cours le lien est bien vert mais il n'est plus accessible (cliquable)
Voici le code sur page web :

<table width="547" height="24" border="0" align="right" cellpadding="0" cellspacing="0" id="tabmenus">

<tr >
<td width="91" ><div align="center" id="lienencours">ACCUEIL</div></td>

<td width="118"><div align="center" class="menus"><a href="asso.html">ASSOCIATION</a></div></td>
<td width="151"><div align="center" class="menus">OFFRES D'EMPLOIS </div></td>
<td width="106"><div align="center" class="menus">BANQUE CV </div></td>
<td width="81"><div align="center" class="menus">CONTACT</div></td>
</tr>

voici le code de la feuille d style :
/* Mise en forme des liens */
#lienencours {
font-family:arial;
font-weight:bold;
font-size:11px;
color:#8fbe47;
text-decoration:none;
}


a:link { color:#ffffff; text-decoration:none;}
a:visited { color:#ffffff; text-decoration:none; }
a:hover { color:#8fbe47; text-decoration:none; }



cependant il est possible de le réaliser en php en identifiant la page en question et en ajoutant une classe spécifique sur ce lien en utilisant le php. cependant je nage un peu en php...
sand

Répondre à mazzette

11

mazzette, le 15 mai 2007 à 14:53:08

On m'a donné également ce lien pour le php...

http://maratz.com/blog/archives/2004/11/18/faux-active-link/­

je vais donc tenter sand

Répondre à mazzette

12

mazzette, le 15 mai 2007 à 16:56:49
  • +1

Ben ca i é jé compris en php ... mais cé la meme chose.. je ne pe recliquer sur le bouton lorsqu'il est actif...

Voici le code :
Chaque début de page inscrire le nom de la page :

Page Index :

<?php $pageName = "ACCUEIL"; ?>
<?php include 'mainNav.php'; ?>

Page ASSOCIATION :
<?php $pageName = "ASSOCIATION"; ?>
<?php include 'mainNav.php'; ?>




La page "MainNav.php" (début du menu) :

<div id="fondmenus">
<table width="547" height="24" border="0" align="right" cellpadding="0" cellspacing="0" id="tabmenus">
<tr >
<td width="91" > <div align="center">
<?php if ($pageName == 'ACCUEIL') { echo '<span id="lienencours">ACCUEIL</span>'; } else { echo '<a href="index.php">ACCUEIL</a>'; } ?></div>
</td>

<td width="118"><div align="center" class="menus">
<?php if ($pageName == 'ASSOCIATION') { echo '<span id="lienencours">ASSOCIATION</span>'; } else { echo '<a href="association.php">ASSOCIATION</a>'; } ?> </div>
</td>



et enfin la feuille de style pour les liens :

#lienencours{
font-family:arial;
font-weight:bold;
font-size:11px;
color:#8fbe47;
text-decoration:none;
}


a:link { font-family:arial;
font-weight:bold;
font-size:11px;
color:#ffffff;
text-decoration:none;}


a:visited { font-family:arial;
font-weight:bold;
font-size:11px;
color:#ffffff; text-decoration:none; }

a:hover { font-family:arial;
font-weight:bold;
font-size:11px;
color:#8fbe47; text-decoration:none; }


sand

Répondre à mazzette

13

mazzette, le 15 mai 2007 à 17:04:40

Petite précision.. il est inutile de faire appel à la classe menus sand

Répondre à mazzette

14

 Seb, le 29 jun 2008 à 01:07:10

Hoo Dalida, MERCI!!!!! Ça fait bien 1 ans que je cherche pourquoi j'ai un prob avec mes liens, mais je ne savais pas qu'il y avais un ordre (Love Hate) :D Merci encore

Répondre à Seb