Menu CSS

Marsh Posté le 01-08-2008 à 12:28:10

Bonjour tout le monde

Je crée la nouvelle version de mon portfolio personnel et j'aurais une question concernant le menu.
C'est un menu simple en texte ( texte gris et texte bleu au passage de la souris ) et j'aimerais que le texte reste bleu.

je m'explique : je clique par exemple sur le lien me contacter, je vais arriver sur la page en question j'aimerais donc, que le lien me contacter reste bleu pour que le visiteur, sache d'un coup d'oeil qu'il est sur cette page.

J'ai cherché partout mais, je n'ai malheureusement pas trouvé la solution.
Si quelqu'un pouvait m'aider, je suis preneur

Merci, bonne journée.

---------------
Mon feedback manifestez-vous!!!

Reply

Marsh Posté le 01-08-2008 à 12:28:10

Reply

Marsh Posté le 01-08-2008 à 12:38:03

bonjour,

tu n'es pas très explicite sur comment sont décrits ces liens,
mais si on cause <a href...>, ch'tiot exemple :

<html>
<head>
<style type="text/css">
a:link { text-decoration:underline;
text-transform:capitalize;
font-weight:normal;
color:#FF0000; }
a:visited { text-decoration:overline;
font-weight:bold;
color:#00FF00; }
a:hover { text-decoration:line-through;
text-transform:uppercase;
font-weight:bolder;
background-color:#FFFF00; }
a:active { text-decoration:none;
text-transform:lowercase ;
font-weight:lighter;
background-color:#CCFFFF; }
a: { text-décoration:blink;
text-transform:none;
font-weight:normal;
color:#000000;
background-color:#C0C0C0; }
</style>
<title>Style Liens</title>
</head>
<body>
<pre><center><h1>aspects des liens grâce à SelfHtml</h1></center>
<a href="http://bul.fr.nf/">chez Moi (enfin mon site)</a><br>
<a href="http://forum.hardware.fr/hfr/Programmation/HTML-CSS-Javascript/menu-css-sujet_116971_1.htm">ici</a><br>
</body>
</html>

---------------
[mon site] [m'écrire]

Reply

Marsh Posté le 01-08-2008 à 14:00:41

Voici mon code de départ :

Code :

.textemenu { color:#bababa; font-family:Arial; font-size:12px; font-style:normal; font-weight:bold; text-decoration:none; }
.textemenu:link { color:#bababa; font-family:Arial; font-size:12px; font-style:normal; font-weight:bold; text-decoration:none; }
.textemenu:hover { color:#008dff; font-family:Arial; font-size:12px; font-style:normal; font-weight:bold; text-decoration:none; }

En regardant ton code j'ai ensuite rajouté cette ligne la :

Code :

.textemenu:active { text-decoration:none; text-transform:lowercase ; font-weight:lighter; background-color:#CCFFFF; }

Mais, la balise active en produit pas l'effet que je veux, l'action se produit au moment ou l'on clique sur le lien, moi ce que je veux c'est le texte reste bleu une fois la page chargée pour que le visiteur puisse savoir à tout moment sur quelle page il se trouve.

Message édité par crtifosi le 01-08-2008 à 14:06:13

---------------
Mon feedback manifestez-vous!!!

Reply

Marsh Posté le 01-08-2008 à 14:23:47

je ne sais pas ce que tu veux dire par "ne produit pas l'effet voulu"...
soit c'est :active qui ne correspond pas à ce que tu veux,
soit le style mis n'est pas correct.

lu chez selfHTML :
:link = pour les liens aux pages qui n'ont pas encore été visitées
:visited = pour les liens aux pages qui ont déjà été visitées
:hover = pour les liens sur lesquels l'utilisateur passe avec la souris
:active = pour les liens en train d'être cliqués
:focus = pour les liens qui deviennent actifs (focus)

Attention: Pour obtenir une représentation correcte des pseudo-formats,
vous devez les noter l'ordre suivant: :link, :visited, :hover, :active.
....

de plus .textmenu... t'es sûr que c'est bien sur une balise a ?
car sinon, avec IE, c'est peut-être ton cas, il faut le bon doctype
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
par exemple.

Cordialement.

---------------
[mon site] [m'écrire]

Reply

Marsh Posté le 01-08-2008 à 14:28:23

En fait que je veux c'est qu'une fois que j'ai cliqué sur le lien me contacter et que la page en question est chargée,
j'aimerais que mon lien au lieu de rester gris il soit bleu pour que l'on sache sur quelle page on est.

Message édité par crtifosi le 01-08-2008 à 14:41:30

---------------
Mon feedback manifestez-vous!!!

Reply

Marsh Posté le 01-08-2008 à 14:38:09

et il n'existe pas un :xxx qui corresponde ?
jouer avec visited... ou autre.
@+

---------------
[mon site] [m'écrire]

Reply

Marsh Posté le 02-08-2008 à 10:59:57

si c'est bien le site de ton profil, j'aurais plutôt fais une liste, en définissant sur le menu correspondant un id avec la couleur que tu veux: le nombre de liens est encore raisonnable
sinon ton menu de gauche est en flash alors qu'un menu en css serait plus intéressant

PS: avec firefox et opera sous linux, ton menu curriculum vitae est mangé

EDIT: ça donnerait:

et dans ton css, tu définis la couleur propre à #pageactuelle

Message édité par blackhawker le 02-08-2008 à 11:07:02

---------------
création de site - photo

Reply

Marsh Posté le 02-08-2008 à 12:26:03

Il faut utiliser un ID / Class pour y arriver. Si tu charges la page sans changer la page courante (ajax / iframe / etc..), tu peux utiliser du javascript pour changer dynamiquement l'ID et y appliquer un style dans ton fichier CSS (du genre: onClick="this.setAttribute('id', 'pageactuelle');" )

Reply

Menu CSS

Sujets relatifs:

Leave a Replay