image cliquable , html et css

A

Anonyme

Invité
Bonjour,
j'essaie actuellement de faire un petit site amateur; bonne occasion pour commencer à apprendre le html et le css. :)
J'ai besoin d'une image de fond centrée sur ma page; par dessus cette image s'affiche un texte , centré lui aussi. Je voudrais maitenant savoir si il est possible de créer une image cliquable en utilisant l'image de fond , sans déclarer dans le code html une <img src> comme je le fais pour l'instant.
J'esère avoir été clair ;)
Joyeux Noel à tous :)
 
Hyp a dit:
Bonjour,
j'essaie actuellement de faire un petit site amateur; bonne occasion pour commencer à apprendre le html et le css. :)
J'ai besoin d'une image de fond centrée sur ma page; par dessus cette image s'affiche un texte , centré lui aussi. Je voudrais maitenant savoir si il est possible de créer une image cliquable en utilisant l'image de fond , sans déclarer dans le code html une <img src> comme je le fais pour l'instant.
J'esère avoir été clair ;)
Joyeux Noel à tous :)

Si ton image est en background, elle ne peut être clicable. Il faut choisir... Une solution pourrait consister via css à déclarer un background sur la balise du lien...;)
 
Hyp a dit:
Bonjour,
j'essaie actuellement de faire un petit site amateur; bonne occasion pour commencer à apprendre le html et le css. :)
J'ai besoin d'une image de fond centrée sur ma page; par dessus cette image s'affiche un texte , centré lui aussi. Je voudrais maitenant savoir si il est possible de créer une image cliquable en utilisant l'image de fond , sans déclarer dans le code html une <img src> comme je le fais pour l'instant.
J'esère avoir été clair ;)
Pour des liens en CSS, des rollovers et des astuces de tout calibre je te renvoi sur le site d'Alsacréation.

Tu peux mettre un lien, rollover ou pas sans avoir à déclarer l'image dans le code car c'est dans les CSS que ça se passe.
 
A la place de mettre ton image en background de ton BODY, rempli ta page avec un TABLE, qui peut également avoir une image en BACKGROUND, ensuite, tu peux récupérer les évenements onCLick sur les TR ou TD de ton TABLE.
En extrapolant, si tu mets juste dans ta page un TABLE avec une seule TR et une seule TD, tu dois pouvoir faire ce que tu as demandé.

Bon courage
 
Sans tableau et sans prise de tête ;)


Bloc de code:
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>test</title>
    <style type="text/css" media="all">
    a#image {margin:25% auto; background: url(fond.gif) 50% 50% no-repeat;display:block; height:64px;line-height:64px;width:64px; text-align:center;text-decoration:none;}
    a#image:hover {background-image: url(fond2.gif);}
    </style>
</head>
<body>
    <a id="image" href="#" title="lien à suivre">texte</a>
    <p>Bon, je crois qu&#8217;il n&#8217;y a rien à ajouter.</p>
</body>
</html>
 
  • J’aime
Réactions: molgow et anntraxh
OlivierL a dit:
A la place de mettre ton image en background de ton BODY, rempli ta page avec un TABLE, qui peut également avoir une image en BACKGROUND, ensuite, tu peux récupérer les évenements onCLick sur les TR ou TD de ton TABLE.
Ça peut effectivement fonctionner comme ça, mais ce n'est pas la méthode la plus propre.

Voici un court article qui peut servir de méthode de base pour mettre une image en arrière-plan d'un lien, sans utiliser <img src...> mais avec CSS.
Arrière-plans cliquables