Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1624 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [RESOLU][CSS] 2 types de liens sur une page...

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[RESOLU][CSS] 2 types de liens sur une page...

n°1092971
Prozac-14
On est dans l'avion...
Posté le 23-05-2005 à 04:03:07  profilanswer
 

Bonjour,
voila, là je péte les plombs car je cherche la solution à mon problème et je ne la trouve pas.
Je suis sous DW MX 2004.
J'ai sur une page 2 types de liens différents...
Le premier est celui de mon menu-bis et le deuxième renvoie avec des pages pop-up d'explication de terme.
 
Or voila je n'arrive pas a conjuger les 2 dans une même feuille de style.
j'ai toujours l'une des 2 CSS qui prend le dessus sur l'autre et qui fait que mes 2 types de liens qui sont disctints (normalement) ne le sont plus.
 
donc comment faire ?
Je voudrais vous signaler que forcement je débute dans les CSS et que là ca me dépasse totalement.
 
Merci par avance de votre aide ;)


Message édité par Prozac-14 le 24-05-2005 à 14:12:32

---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
mood
Publicité
Posté le 23-05-2005 à 04:03:07  profilanswer
 

n°1092973
afbilou
pouet your life
Posté le 23-05-2005 à 04:36:02  profilanswer
 

bah ...
Montre nous un exemple de code PERTINENT : pas ta page entiere ... juste la partie des CSS ou tu definis le style de tes liens et la partie de ton code (X)HTML qui utilise tes liens.
 
Ton probleme est surement lié a une histoire de priorite.

n°1092975
Prozac-14
On est dans l'avion...
Posté le 23-05-2005 à 05:46:43  profilanswer
 

afbilou a écrit :

bah ...
Montre nous un exemple de code PERTINENT : pas ta page entiere ... juste la partie des CSS ou tu definis le style de tes liens et la partie de ton code (X)HTML qui utilise tes liens.
 
Ton probleme est surement lié a une histoire de priorite.


 
donc voici une partie de mon code...
dans ma page HTML
 

Citation :

<meta name="identifier-url" content="http://www.pc14.fr/">
<meta name="revisit-after" content="15 days">
<title>PC14</title>
<link href="css/style1.css" rel="stylesheet" type="text/css">
<link href="css/style2.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">
<!--


 
et voici mes css...
style1
 

Citation :

.style1 {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 font-style: normal;
 line-height: normal;
 text-indent: 10px;
 color:#333333;
}
.liens {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 10px;
 color: #FFFFFF;
}
.stylelinkwhite {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 font-style: normal;
 line-height: normal;  
 color:#FFFFFF;
}
body {
 background-color: #CCCCCC;
 margin-top: 0px;
 margin-left : 0px;
 margin-right : 0px;
 margin-bottom: 0px;
 background-image:  url("../images/01/016.gif" );
}
a:link {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-style: normal;
 line-height: normal;
 font-size: 12px;
 color: #333333;
 text-decoration: none;
}
a:visited {
 color: #333333;
 text-decoration: none;
}
a:hover {
 color: #333333;
 text-decoration: underline;
}
a:active {
 color: #333333;
 text-decoration: none;
}


 
et mon style2
 

Citation :

.style2 {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 10px;
 font-style: normal;
 line-height: normal;
 color:#ffffff;
}
a:visited {
 color: #ffffff;
 text-decoration: none;
}
a:hover {
 color: #ffffff;
 text-decoration: underline;
}
a:active {
 color: #ffffff;
 text-decoration: none;
}


 
bon je pense qu'un pro va voir tout de suite où est le problème mais moi je ne vois plus car il est 05h45 du mat et je dois me lever dans... 4 heures au maximum... merci de votre aide car LA je suis mort...


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1092981
masklinn
í dag viðrar vel til loftárása
Posté le 23-05-2005 à 07:32:34  profilanswer
 

Quand le navigateur "voit" deux fichiers CSS, il se comporte comme s'il n'y en avait qu'un seul avec le 2e placé à la fin du premier.
 
Ici, les règles du 2e CSS écrasent donc celles du premier.
 
Il te faut utiliser des classes ou utiliser la cascade CSS pour accéder à tes différents liens, si tu ne dis pas aux CSS comment reconnaître des liens distincts elles ne risquent pas de le faire.


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1092982
webmidipyr​enees
Posté le 23-05-2005 à 07:36:43  profilanswer
 

Salut,
Tu as bien 2 feuilles de style mais tu définis 2 fois la balise a (une fois dans chque feuille de style) mais le navigateur ne va choisir que l'une ou l'autre des 2 définitions.
Pour bien séparer les liens tu peux faire qu'une feuille de style (à moins que les 2 te soient vraiment nécessaire) dans laquelle tu définis tes styles et pour les liens tu les sépares de la façon suivante a.style1:link et a.style2:link (de même pour les autres attributs de a) et dans ton code tu mets <a class="style1" ...> et <a class="style2" ...>

n°1092984
masklinn
í dag viðrar vel til loftárása
Posté le 23-05-2005 à 07:47:55  profilanswer
 

webmidipyrenees a écrit :

tu les sépares de la façon suivante a.style1:link et a.style2:link (de même pour les autres attributs de a) et dans ton code tu mets <a class="style1" ...> et <a class="style2" ...>


Pas terrible: style1 et style2 ne veulent rien dire, ils vont vite ne plus être reconnus et être inmaintenables, mieux vaut les séparer en fonction de leur signification (utiliser les classes "menubis" et "popup" par exemple), ou mieux utiliser l'héritage pour y accéder depuis leur parent (#menubis a et #popup a)


Message édité par masklinn le 23-05-2005 à 07:51:38

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1092985
webmidipyr​enees
Posté le 23-05-2005 à 07:50:01  profilanswer
 

c'était juste un exemple pour lui montrer de séparer ces liens  mais c'est vrai que les noms sont mal choisi

n°1093002
Prozac-14
On est dans l'avion...
Posté le 23-05-2005 à 08:58:24  profilanswer
 

les garçons... et les filles je vous remercie... je viens d'être reveiller au mileu de ma nuit par un c*n au tel... je me recouche, je fais dodo encore 2 heures et on n'en reparle.
 
Merci merci merci merci... ;)
 
 
(allez hop au dodo.. en plus il fait super beau, ca m'embete d'aller me recoucher mais si je ne le fait pas : je ne pourrais pas faire tout ce que j'ai à faire aujourd'hui...)


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1094791
Prozac-14
On est dans l'avion...
Posté le 24-05-2005 à 12:34:26  profilanswer
 

masklinn a écrit :

Pas terrible: style1 et style2 ne veulent rien dire, ils vont vite ne plus être reconnus et être inmaintenables, mieux vaut les séparer en fonction de leur signification (utiliser les classes "menubis" et "popup" par exemple), ou mieux utiliser l'héritage pour y accéder depuis leur parent (#menubis a et #popup a)


 
bon alors voila ce que cela donne MAIS bien entendu : cela ne fonctionne absolument pas...
 

Citation :

.style1 {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 font-style: normal;
 line-height: normal;
 text-indent: 10px;
 color:#333333;
}
.liens {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 10px;
 color: #FFFFFF;
}
.stylelinkwhite {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 font-style: normal;
 line-height: normal;  
 color:#FFFFFF;
}
body {
 background-color: #CCCCCC;
 margin-top: 0px;
 margin-left : 0px;
 margin-right : 0px;
 margin-bottom: 0px;
 background-image:  url("../images/01/016.gif" );
}
a:link {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-style: normal;
 line-height: normal;
 font-size: 12px;
 color: #333333;
 text-decoration: none;
}
a:visited {
 color: #333333;
 text-decoration: none;
}
a:hover {
 color: #333333;
 text-decoration: underline;
}
a:active {
 color: #333333;
 text-decoration: none;
}
 
#menubis a:link{
 color: #ffffff;
 text-decoration: none;  
}
#menubis a:visited{
 color: #ffffff;
 text-decoration: none;
}
#menubis a:hover {
 color: #ffffff;
 text-decoration: underline;
}
#menubis a:active {
 color: #ffffff;
 text-decoration: none;
}


 
Est-ce que quelqu'un peu m'expliquer pourquoi ? Car là, j'ai cherché la solution durant 2 heures hier, 2 heures aujourd'hui et là je commence à  :pt1cable:  :pt1cable:  :pt1cable:  :pt1cable:  :pt1cable:  :pt1cable:  :pt1cable:  
 
 
merci.


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1094799
masklinn
í dag viðrar vel til loftárása
Posté le 24-05-2005 à 12:41:35  profilanswer
 

Je suis pas madame soleil moi, sans le code HTML je vais avoir du mal à t'aider [:itm]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
mood
Publicité
Posté le 24-05-2005 à 12:41:35  profilanswer
 

n°1094810
denzz
huhuuuuu ! (désolé )
Posté le 24-05-2005 à 12:46:53  profilanswer
 


Code :
  1. #menubis a:link{
  2. color: #ffffff;
  3. text-decoration: none; 
  4. }
  5. #menubis a:visited{
  6. color: #ffffff;
  7. text-decoration: none;
  8. }
  9. #menubis a:hover {
  10. color: #ffffff;
  11. text-decoration: underline;
  12. }
  13. #menubis a:active {
  14. color: #ffffff;
  15. text-decoration: none;
  16. }


-->

Code :
  1. .menubis{
  2. color: #ffffff;
  3. text-decoration: none; 
  4. }
  5. .menubis:visited{
  6. color: #ffffff;
  7. text-decoration: none;
  8. }
  9. .menubis:hover {
  10. color: #ffffff;
  11. text-decoration: underline;
  12. }
  13. .menubis:active {
  14. color: #ffffff;
  15. text-decoration: none;
  16. }


et voilà ...
les 'attributs' :hover,:visited, etc sont applicables sur n'importe quel style css perso.... pas obligé de mettre le 'a' devant, qui sera utilisé automatiquement pour tous tes liens...
je te conseille même de ne pas utiliser de css pour 'a' mais bien 2 styles différents, que tu appliqueras aux liens qui vont bien...

n°1094940
Prozac-14
On est dans l'avion...
Posté le 24-05-2005 à 14:11:53  profilanswer
 

A... ok LOL...
moi je pensais que l'on été OBLIGE d'utiliser le A...
maintenant effectivement : c'est plus simple, et CA MARCHE !!!
 
je remercie toutes les personnes qui me sont venue en aide pour ce problème technique.
 
Grace à vous je commence a nettement mieux comprendre le fonctionnement des CSS, alors que cela faisait un bout de temps que j'essayais, de comprendre le fonctionnement de cette chose, et grace à vous, je commence à comprendre pas mal de trucs... ;)


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1094977
masklinn
í dag viðrar vel til loftárása
Posté le 24-05-2005 à 14:26:16  profilanswer
 

denzz a écrit :

-->

Code :
  1. .menubis{
  2. color: #ffffff;
  3. text-decoration: none; 
  4. }
  5. .menubis:visited{
  6. color: #ffffff;
  7. text-decoration: none;
  8. }
  9. .menubis:hover {
  10. color: #ffffff;
  11. text-decoration: underline;
  12. }
  13. .menubis:active {
  14. color: #ffffff;
  15. text-decoration: none;
  16. }



Magnifique code pas optimisé [:spamafote]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1094991
denzz
huhuuuuu ! (désolé )
Posté le 24-05-2005 à 14:33:45  profilanswer
 

masklinn a écrit :

Magnifique code pas optimisé [:spamafote]


 
 
bien sur qu'il est pas optimisé ... le but c pas de tout faire a sa place, si ? ?  
 
ca commence a me souler les remarques a 2 balles et les critiques super constructives ...
en plus, c pas pour 10 lignes dans un fichier css que tu vas saturer la bp de ton visiteur.... alors les remarques comme ca franchement :kaola:  :kaola:  :kaola:  :kaola:  :kaola:


Message édité par denzz le 24-05-2005 à 14:34:14
n°1094993
Prozac-14
On est dans l'avion...
Posté le 24-05-2005 à 14:34:15  profilanswer
 

peux importe... du moment que cela marche...
je sais que je peux virer les color: #FFFFFF et les text-decoration: none sauf dans le premier... mais ca marche comme ca...


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1094996
denzz
huhuuuuu ! (désolé )
Posté le 24-05-2005 à 14:36:07  profilanswer
 

( tu peux même virer les classes active et visited pour faire plaisir à madame soleil)

n°1094998
FlorentG
Posté le 24-05-2005 à 14:37:52  profilanswer
 

Prozac-14 a écrit :

peux importe... du moment que cela marche...
je sais que je peux virer les color: #FFFFFF et les text-decoration: none sauf dans le premier... mais ca marche comme ca...


Et au passage utiliser la forme courte : #fff ;)

n°1095001
masklinn
í dag viðrar vel til loftárása
Posté le 24-05-2005 à 14:39:36  profilanswer
 

denzz a écrit :

bien sur qu'il est pas optimisé ... le but c pas de tout faire a sa place, si ? ?  
 
ca commence a me souler les remarques a 2 balles et les critiques super constructives ...


J'ai mentionné l'utilisation de l'héritage CSS il me semble [:itm]  
 
Et des IDs [:itm]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1095003
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 24-05-2005 à 14:40:40  profilanswer
 

Perso, je laisserais active et visited, j'ai déjà eu des surprises en virant le visited, par contre, tu peux faire comme ça je pense :

Code :
  1. .menubis:link, .menubis:visited, .menubis:active {
  2.      color: #fff;
  3.      text-decoration: none; 
  4. }
  5. .menubis:hover {
  6.      color: #fff;
  7.      text-decoration: underline;
  8. }


 
Si il y a encore d'autres moyens d'optimiser, n'hésitez pas, montrez le, comme ça on le saura une fois pour toutes. ;)


Message édité par The-Shadow le 24-05-2005 à 14:44:51
n°1095005
Prozac-14
On est dans l'avion...
Posté le 24-05-2005 à 14:41:30  profilanswer
 

FlorentG a écrit :

Et au passage utiliser la forme courte : #fff ;)


ah bon c'est possible ca ??? je savais pas... merci du truc.  ;)


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1095010
Prozac-14
On est dans l'avion...
Posté le 24-05-2005 à 14:42:47  profilanswer
 

finalement j'ai bien fait de poser cette question... tout le monde apprend des trucs aujourd'hui !


---------------
Je suis capable du meilleur comme du pire, mais c'est dans le pire que je suis le meilleur.
n°1095018
denzz
huhuuuuu ! (désolé )
Posté le 24-05-2005 à 14:44:51  profilanswer
 

ouais, mais masklinn va pas être content, y'a pas d'héritage...

n°1095033
masklinn
í dag viðrar vel til loftárása
Posté le 24-05-2005 à 14:51:50  profilanswer
 

Prozac-14 a écrit :

ah bon c'est possible ca ??? je savais pas... merci du truc.  ;)


Pour ce genre de trucs, Roger Johansson a écrit trois très bons articles sur 456 Berea Street:
Efficent CSS with shorthand properties
CSS Tips&Tricks, part 1
et CSS Tips&Tricks part 2
 
Et pour se souvenir de ce genre de choses, rien de mieux que la CSS Cheat Sheet de Dave Child.

denzz a écrit :

ouais, mais masklinn va pas être content, y'a pas d'héritage...


[:kiki]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [RESOLU][CSS] 2 types de liens sur une page...

 

Sujets relatifs
[RESOLU] [PHP] Lancer un script toutes les semaines à telle heure ?[Partage CSS/HTML] Petite barre de notation 'quivabien'
[Résolu] : Problème de liens "local/en ligne".HELP: Partager ma page php
restreindre acces à certaines page de mon site[CSS/HTML ?] Barre de défilement horizontale gênante
Comment detecter une case cochée en dans une page JSPCSS et Javascript dans un include
comment ouvrir une page internet avec MS DOS 
Plus de sujets relatifs à : [RESOLU][CSS] 2 types de liens sur une page...

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.076 secondes

Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR