Couleur d un lien vers un document

**danfa** · 16/01/2009, 00h38

Bonjour

Dans une page de mon site, j'ai créé un lien vers un document et je voudrais tout comme dans mon menu que ce lien soit toujours blanc, visité ou pas, povez vous m'indiquer comment faire svp, je place le code htmal dela page et le code css du site. Le lien est en bas de la page

Merci

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="design_acuq.css" />
 
<title>Site de l'ACUQ</title>
<style type="text/css">
<!--
a:link {
        color: #FFFFFF;
}
-->
</style></head>
 
<body>
<div id="en_tete">
   <!-- Ici on mettra la bannière -->
 
</div>
 
<div id="menu">
   <!-- Ici on mettra le menu -->
 
 <div class="element_menu"> <!-- Cadre correspondant à un sous-menu -->
        <!-- ici on pourrait placer le titre du menu -->
        <!-- ici on pourrait placerles balises H? pour la grosseur des caracteres -->
       <ul> 
         <li class="puce"><a href="nouvelles2.htm">Salle des nouvelles</a></li>           
         <li class="puce"><a href="ca2.htm">Conseil d'administration</a></li>
         <li class="puce"><a href="page3.html">Congrès</a></li>
         <li class="puce"><a href="membre2.htm">Devenir membre</a></li>
         <li class="puce"><a href="reglements2.htm">Règlements</a></li> 
         <li class="puce"><a href="presse2.htm">Salle de presse</a></li>         
         <li class="puce"><a href="liens2.htm">Liens utiles</a></li> 
         <li class="puce"><a href="joindre2.htm">Nous joindre</a></li>
         <li class="puce"><a href="/forum/index.php">Forum de discussion</a></li> 
 
    </ul>
  </div>
 
 
 
   </div>
 
 
 
<div id="corps">
   <!-- Ici on mettra le contenu principal de la page (tout le texte quoi) -->
 
 
 
   <h2>Règlements de l'Association des centres d'urgence<br /> 
   9-1-1 du Québec</h2> 
 
  <h4>Vous trouverez au bas de cette page en document pdf, les règlements de l'ACUQ 911.</h4>
 
   <h4>Ceci est la dernière version votée lors de l'assemblée générale du 9 novembre 2007.</h4>
 
   <h4>Nous vous rappelons que seul les membres actifs ayant acquittés leurs frais de       renouvellement pour l'année en cours auront le droit de vote sur toutes modifications       qui pourraient être soumises.</h4>
 
   <h4>Si vous n'êtes pas encore membre ou si vous désirez renouveler votre abonnement, les informations nécessaires se retrouvent sous l'onglet "Devenir Membre"</h4><br />
 
  <h4> <center><a href="../htdocs/REGLEMENTS GENERAUX DE LA CORPORATION - version 7.doc">Règlements de l'ACUQ 9-1-1</center></h4>  
  <br />
 
</div>
 
<div id="pied_de_page">
   <!-- Enfin, on mettra en bas de la page le nom de l'auteur, un copyright... -->
 
   <p>Copyright 2008 "ACUQ 9-1-1" tous droits réservés</p>
</div>
 
 
 
</body>

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
 
@charset "utf-8";
/* CSS Document */
 
body
{
	width: 760px;
	margin: auto; /* Pour centrer notre page */
	margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
	margin-bottom: 20px;    /* Idem pour le bas du navigateur */
	background-color: #8B0000;  /* fond rouge */
}
/* L'en-tête */
 
#en_tete
{
	width: 760px;
	height: 130px;
	background-color: #ffffff;  /* fond rouge */
	background-position:center center ;
	background-image: url(/images/logo_acuq.jpg);  
	background-repeat: no-repeat;
	margin-bottom: 10px;
	border-top-style: none;
	border-top-color: #99FF00;
	margin-left:0px;
}
 
/* Le menu */
 
#menu
{
   float: left;
   width: 180px;
   height: 400px;
}
 
.element_menu
{
	background-color: #3333cc;	
	background-repeat: no-repeat;
	border: 2px solid black;
	margin-bottom: 20px;
}
 
 /* Quelques effets sur les menus */
 
 
.element_menu h3 /* Tous les titres de menus */
{    
   color: #B3B3B3;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}
 
.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("images/puce.png"); /* On change l'apparence des puces */
   padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 18px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
 
}
.puce
{
margin-top: 18px;
}
.element_menu a /* Tous les liens se trouvant dans un menu */
{
   color: #ffffff;
}
.element_menu a:visited
{
	color: #ffffff;
}
 
.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
	background-color: #3333FF;
	color: black;
}
 
/* Le corps de la page */
 
#corps
 
{
	margin-left: 190px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
	margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
	min-height: 375px;
	padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
	color: #FFFFFF;
	background-color: #3333cc; /* Une couleur de fond pour le corps */
	background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
	border: 2px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
	position: relative;
}
 
 
 
/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */
 
#pied_de_page
{
   padding: 10px;
   margin-left: 190px;
   text-align: center;
   margin-top: 15px;
 
   color: #ffffff;
   background-color: #3333cc;
 
   background-repeat: no-repeat;
 
   border: 2px solid black;
}

**Vil'Coyote** · 16/01/2009, 09h46

ajoute la class correspondant à ton texte blanc dans tes <a> et améliore ta classe en précisant a.taclass { color: #FFFFFF; } a.taclass:visited { color:#FFFFFF;}

**danfa** · 16/01/2009, 17h58

Merci Coyote mais je ne suis pas sur de comprendre, pourrais tu m'expliquer un peu plus ou me donner un exemple svp

merci d'avance

**HiRoN** · 16/01/2009, 20h23

Envoyé par danfa

Merci Coyote mais je ne suis pas sur de comprendre, pourrais tu m'expliquer un peu plus ou me donner un exemple svp

Salut,

Traduction directe (je n'ai pas essayé) :

Tu modifies les liens voulus de type :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="xxx.htm">Nom</a>

Par :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="xxx.htm" class="le_nom_de_classe_que_tu_veux">Nom</a>

Et dans ton fichier CSS, ajoutes :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
a.le_nom_de_classe_que_tu_as_mis_plus_haut { color: #FFFFFF; } 
a.le_nom_de_classe_que_tu_as_mis_plus_haut:visited { color:#FFFFFF;}

**danfa** · 16/01/2009, 21h11

MERCI beaucoup à vous deux ca fonctionne à merveille

Couleur d un lien vers un document

CSS

Vue hybride

Discussions similaires

Partager

Partager