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

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Comment faire un lien sur images avec du css ?

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Comment faire un lien sur images avec du css ?

n°1253931
mansour
Posté le 26-11-2005 à 20:35:55  profilanswer
 

Bonjour,
 
Je suis un apprentis en ce qui concerne les css  :)  
Mon problème c'est que je ne sais pas comment je pourrais faire un lien sur une image en css !
 

Code :
  1. ex: en html on ferait <href="#"><img src="#"></a> mais en css  ?


alors quelqu'un serait quel bout de code dois-je utilisé en css pour faire un lien sur une image ?  
 
 
merci d'avance

mood
Publicité
Posté le 26-11-2005 à 20:35:55  profilanswer
 

n°1253935
KangOl
Profil : pointeur
Posté le 26-11-2005 à 20:40:17  profilanswer
 

[:pingouino]
 


---------------
Nos estans firs di nosse pitite patreye...
n°1253944
mansour
Posté le 26-11-2005 à 20:59:44  profilanswer
 

Ex: sur la première page je mets une image, je clique dessus, puis je vais sur la deuxième page  :pt1cable:  
 
Comment faire ça en css ?  :)  
 
SVP aider moi !

n°1253946
KangOl
Profil : pointeur
Posté le 26-11-2005 à 21:01:07  profilanswer
 

tu as pas trop du comprendre a quoi sert les css


---------------
Nos estans firs di nosse pitite patreye...
n°1253950
mansour
Posté le 26-11-2005 à 21:10:52  profilanswer
 

Peut être que non ! Je vous ai dis qe j'étais débutant !
Au lieu de dire non ce n'est pas possible de faire ça en css, vous dites tout pour énerver les gens.  
Et après comme d'habitude quand on vous dit quelque chose, après les personnes qui ne respectent pas les règles du  forum c'est toujours nous ! :fou:  
 
Tu ne peux pas dire, écoute, non ça ce n'est pas possible ça. C'est dur de dire ça ?!
 
Merci comme même de votre aide  :(  Je vais aller voir sur un autre forum.


Message édité par mansour le 26-11-2005 à 21:11:45
n°1253952
KangOl
Profil : pointeur
Posté le 26-11-2005 à 21:13:01  profilanswer
 

non c'est pas possible :o
 
et faut pas s'enerver comme ca :o


---------------
Nos estans firs di nosse pitite patreye...
n°1253954
mansour
Posté le 26-11-2005 à 21:18:34  profilanswer
 

Je viens te dire que tu fais tout pour m'énervé + tu t'énerves aussi. Y'a pas quoi moi qui s'énerve  :fou:  
 
Et pour quelle raison tu affiche le drapeau à chaque fois tu réponds ?  :pfff:

n°1253955
KangOl
Profil : pointeur
Posté le 26-11-2005 à 21:25:01  profilanswer
 

mansour a écrit :

Et pour quelle raison tu affiche le drapeau à chaque fois tu réponds ?  :pfff:


[:rofl]


---------------
Nos estans firs di nosse pitite patreye...
n°1253957
afbilou
pouet your life
Posté le 26-11-2005 à 21:25:45  profilanswer
 

Un lien c'est de l'html ... rien a voir avec les CSS ... tu fais une enorme confusion assez peu courante pour etonner Kangol voila tout.
C'est navrant quand meme :p

n°1253958
afbilou
pouet your life
Posté le 26-11-2005 à 21:26:29  profilanswer
 

il parle du drapeau dans la liste des topics ? :D

mood
Publicité
Posté le 26-11-2005 à 21:26:29  profilanswer
 

n°1253959
mansour
Posté le 26-11-2005 à 21:27:35  profilanswer
 

Merci Afbilou  :)  La j'ai compris.
 
Pas de merci pour ce petit kangol = mongol  :lol:   :kaola:


Message édité par mansour le 26-11-2005 à 21:29:11
n°1253960
KangOl
Profil : pointeur
Posté le 26-11-2005 à 21:30:01  profilanswer
 

au moins tu m'as fait rire ^^


---------------
Nos estans firs di nosse pitite patreye...
n°1253961
KangOl
Profil : pointeur
Posté le 26-11-2005 à 21:30:48  profilanswer
 

enfin, plus depuis ton edit...
 
tu restes poli stp...


---------------
Nos estans firs di nosse pitite patreye...
n°1253962
mansour
Posté le 26-11-2005 à 21:32:08  profilanswer
 

nooooooooo  :lol:

n°1253963
KangOl
Profil : pointeur
Posté le 26-11-2005 à 21:33:22  profilanswer
 

:heink:


---------------
Nos estans firs di nosse pitite patreye...
n°1253965
mansour
Posté le 26-11-2005 à 21:36:33  profilanswer
 

[:abnocte invictus] :lol:

n°1254101
Roane
Pingouino's fan
Posté le 27-11-2005 à 11:38:12  profilanswer
 

http://plainsofpain.free.fr/img/hiboux/owllol1fg.jpg
 
 [:ban]
 
Edit, ah ben, à 15 ans, c'est un ado rebelle envers l'autorité, ca explique son comportement ridicule malpoli et débile à souhait :)
 
En espérant que tu reviennes plus jamais, mansour  [:benou_miam]


Message édité par Roane le 27-11-2005 à 11:39:15

---------------
http://www.alsacreations.com, http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net. A ne surtout pas prendre en exemple : http://www.worldinternet.be
n°1256610
coxine
Posté le 01-12-2005 à 09:36:55  profilanswer
 

Et bien si ! On y arrive !
Je suis aussi "apprentie"...
Je suis venue ici hier pour trouver une réponse, je l'ai trouvée ailleurs, (alsacréations) et vous la livre.
Dommage de lire que parfois les échanges tournent mal et qu'il y ait peu de "tolérance" envers les débutants comme nous.
Enfin...!
 
Dans la div où se situe l'image.
Insérer un lien a href

Code :
  1. <div id="top"><div class="zone1"><a class="zone1" href="../index.php" title="Retour accueil"></a></div></div>


 
et lesz CSS correspondantes :

Code :
  1. .zone1 {    /* zone cliquable */
  2. width : 250px;
  3. height: 97px;
  4. float:left;
  5. margin: 10px 10px 10px 30px;
  6. }
  7. .zone1 a:link, .zone1 a:visited, .zone1 a:hover, .zone1 a:active { /* pas de lien sur zone cliquable */
  8. text-decoration:none;
  9. border-bottom:none;
  10. }


 
J'ai dû rajouter des spécifications pour les liens pour l'image, sinon, il prenait en compte les CSS des liens normaux.
J'espère que je suis claire, pas facile d'expliquer lorsqu'on débute.

n°1256755
FlorentG
Unité de Masse
Posté le 01-12-2005 à 12:58:10  profilanswer
 

coxine a écrit :

Et bien si ! On y arrive !


Non, on ne peut pas. Les CSS font partie de la présentation. Un lien fait partie du contenu/de la structure. Même avec la pseudo-class :content, on ne peut pas générer des éléments dans la partie HTML.
 

coxine a écrit :

Dans la div où se situe l'image.
Insérer un lien a href

Code :
  1. <div id="top"><div class="zone1"><a class="zone1" href="../index.php" title="Retour accueil"></a></div></div>


 
et lesz CSS correspondantes :

Code :
  1. .zone1 {    /* zone cliquable */
  2. width : 250px;
  3. height: 97px;
  4. float:left;
  5. margin: 10px 10px 10px 30px;
  6. }
  7. .zone1 a:link, .zone1 a:visited, .zone1 a:hover, .zone1 a:active { /* pas de lien sur zone cliquable */
  8. text-decoration:none;
  9. border-bottom:none;
  10. }


 
J'ai dû rajouter des spécifications pour les liens pour l'image, sinon, il prenait en compte les CSS des liens normaux.
J'espère que je suis claire, pas facile d'expliquer lorsqu'on débute.


Désolé, mais... Et alors ? Y'a pas de lien en CSS [:johneh] Ensuite à quoi sert ta div autour du lien ? Vu que tu appliques la classe zone1 au lien et à la div autour :??:

n°1256758
Roane
Pingouino's fan
Posté le 01-12-2005 à 13:00:50  profilanswer
 

coxine a écrit :

Et bien si ! On y arrive !
Je suis aussi "apprentie"...
Je suis venue ici hier pour trouver une réponse, je l'ai trouvée ailleurs, (alsacréations) et vous la livre.
Dommage de lire que parfois les échanges tournent mal et qu'il y ait peu de "tolérance" envers les débutants comme nous.
Enfin...!


 
Le

Citation :

Kangol= mongol

était poli peut-etre ?
 
Faut pas abuser non plus, on est pas là pour aider et se faire insulter en échange :o


---------------
http://www.alsacreations.com, http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net. A ne surtout pas prendre en exemple : http://www.worldinternet.be
n°1256761
coxine
Posté le 01-12-2005 à 13:06:21  profilanswer
 

rho vous jouez sur les mots !
Peut être que mansour s'est mal exprimé en posant sa question.
SVP les développeurs pro, soyez indulgents sur la sémantique que l'on emploie. J'ai remarqué que lorsqu'on est débutant et que l'on se plante sur des termes ou mots, on nous le fait remarquer mais l'on n'a pas pour autant la réponse à notre question.
 
Moi j'ai été confrontée à ce problème : j'ai une image en background dans le top de mon site (gérée par une CSS), et je n'arrivais pas à y insérer un lien. donc plutôt de répondre ah ben t'as tout faux, aidez-nous ! On a précisé que nous sommes débutants.
 
Je ne sais pas comment j'y suis arrivée, mais le résultat que j'attendais est là
J'ai enfin un lien sur toutes les pages de mon site sur l'image du calque "top". qui permet de revenir à l'accueil. Je ne voulais pas insérer cette image en "dur".
Ok y a pas un lien en CSS, mais un lien <a href> inséré dans la div class zone 1 qui elle est plus petite que mon image d'origine (800x130).
Je ne connais pas de forum pour archis débutants...dommage, car j'apprends bcp des gens qui maitrisent..mais pas toujours facile de trouver des oreilles indulgentes !

n°1256763
coxine
Posté le 01-12-2005 à 13:08:55  profilanswer
 

oups je vois que qq'un a répondu pendant que postais mon dernier message.
Je ne fais pas allusion aux "insultes" puériles. Je n'ai pas de remarque à faire à ce sujet, je trouve cela vraiment déplacé et dommage.
Je ne suis pas venue pour prendre la défense de qqu'un, juste pour "échanger" cordialement, et trouver des réponses à mes questions !
Mais comme je le disais, peut-être qu'il existe d'autres forums pour "nuls"..mais malheureusement, ce n'est pas là-bas qu'on trouvera des réponses de pros et d'experts pour nous faire avancer !
 :)

n°1256766
FlorentG
Unité de Masse
Posté le 01-12-2005 à 13:10:22  profilanswer
 

coxine a écrit :

rho vous jouez sur les mots !
Peut être que mansour s'est mal exprimé en posant sa question.


Oui, je pense que tu as loupé ce qu'il a dit :D
 

coxine a écrit :

SVP les développeurs pro, soyez indulgents sur la sémantique que l'on emploie.


Sauf que c'est grâce à la sémantique qu'on comprend ce que veux faire l'homme... Et parfois, c'est dur de deviner :(
 

coxine a écrit :

J'ai enfin un lien sur toutes les pages de mon site sur l'image du calque "top". qui permet de revenir à l'accueil. Je ne voulais pas insérer cette image en "dur".


Sauf que du coup, le lien est vide... Vraiment pas top pour l'accessbilité et pour les moteurs de recherche... Même avec l'utilisation de l'attribut title, je ne pense pas que ça soit super :(
 

coxine a écrit :

Ok y a pas un lien en CSS, mais un lien <a href> inséré dans la div class zone 1 qui elle est plus petite que mon image d'origine (800x130).


La div zone1 ne sert à rien, tu peux la supprimer. Seul le lien sert.

n°1256768
FlorentG
Unité de Masse
Posté le 01-12-2005 à 13:12:22  profilanswer
 

coxine a écrit :

Mais comme je le disais, peut-être qu'il existe d'autres forums pour "nuls"..


Y'a le forum d'alsacréations où c'est un peu plus gentil niveau accueil.
 
Mais un forum spécial super-nul est extrêmement difficile à tenir : on le vois ici, les super-nuls posent toujours les mêmes questions, font toujours les même erreurs, et oublient de commencer par le commencement. Genre s'intéresser un peu à la technologie employée, étudier la liste des balises disponibles, bien piger les notions de séparation contenu/présentation. Bref, faire un site web n'est pas si facile que ça...

n°1256771
coxine
Posté le 01-12-2005 à 13:16:24  profilanswer
 

Florent
Désolée je ne sais pas faire de citation  :D  
Ca veut dire quoi : "Sauf que du coup, le lien est vide... Vraiment pas top pour l'accessbilité et pour les moteurs de recherche... Même avec l'utilisation de l'attribut title, je ne pense pas que ça soit super :( "
Ce lien n'apparait pas sur la page d'accueil. Mais sur les pages dans le contenu, dans des répertoires. Il y a aussi un fil d'ariane qui permet de naviguer. En fait, j'ai souhaité rajouter le lien sur l'image du haut, car quelqu'un (un pro internet) m'a fait la remarque que cela manquait à la bonne ergonomie du site.
 
Y a-t-il d'autres solutions ? :??:  
 
Je précise, que je suis webmestre pour un site associatif...que je ne suis pas pro, mais passionnée par le langage de prog, la découverte récente (pour ma part) du Xhtml et de la programmation php..;et que j'ai appris sur le "tas" grâce à des sites comme celui ci, alsacreations, et bien d'autres.... ;)  

n°1256810
omega2
Posté le 01-12-2005 à 14:10:38  profilanswer
 

Pour la citation, clique l'image http://forum-images.hardware.fr/themes_static/images_forum/1/quote.gif en dessous du message que tu veux citer. Ca t'ouvrira une page avec le message en citation. Tu peux aussi cliquer sur l'image http://forum-images.hardware.fr/themes_static/images_forum/1/quote+.gif mais je sais pas exactement comment ca marche.
 
Ce qu'il veut dire pour l'acessibilité, c'est que pour ceux qui ne voyent pas l'image de fond (aveugle et malvoyant disposant de logiciels de lecture vocale, personne disposant d'un navigateur texte ou d'un navigateur réglé pour ne pas afficher les images, ...) le lien n'est pas cliquable vu qu'il ne prendra aucun pixel à l'écran et même si on peut le sélectioner, on ne saura pas vers quoi il pointe vu qu'on ne voit pas l'image de toute maniére.

Message cité 1 fois
Message édité par omega2 le 01-12-2005 à 14:11:19
n°1256826
coxine
Posté le 01-12-2005 à 14:22:39  profilanswer
 

omega2 a écrit :

Ce qu'il veut dire pour l'acessibilité, c'est que pour ceux qui ne voyent pas l'image de fond (aveugle et malvoyant disposant de logiciels de lecture vocale, personne disposant d'un navigateur texte ou d'un navigateur réglé pour ne pas afficher les images, ...) le lien n'est pas cliquable vu qu'il ne prendra aucun pixel à l'écran et même si on peut le sélectioner, on ne saura pas vers quoi il pointe vu qu'on ne voit pas l'image de toute maniére.

:pt1cable:  
Merci pour l'explication !
Ok, capito.
Bon, j'espère que le fil d'ariane que j'ai mis sur les pages, qui est en fait une image là cette fois ci  :sarcastic:  aidera les malvoyants ou autres personnes n'affichant pas les images à se repérer dans le site.
Ou bien, je vais le mettre en texte et non en images !
Merci pour tout !
Je vais tenter une application PHP pour intégrer un moteur..au vu des réponses ds le topic "php" j'ai tout intérêt à cogiter un peu avant de poser ma question  :lol:  
 
 ;)

mood
Publicité
Posté le   profilanswer
 


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

  Comment faire un lien sur images avec du css ?

 

Sujets relatifs
creer lien hypertexte sur image en différents pointsLes images, php et base de données
Bouger des images (ou graphiques) à intervale régulier[ereg] Retrouver tout les liens des images <img> et des liens <a>
pb résolu: créer un lien hypertextsurvol d'un lien et images.
Javascript : un lien pour afficher une image parmi une liste d'images[ASP] Afficher les images lié par lien OLE d'une base Access
[html] tableau + images + lien => le truc alakhon ! HELP WANTED !!Images et lien ??
Plus de sujets relatifs à : Comment faire un lien sur images avec du css ?


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