Appliquer un lien hypertexte sur un background

ivoyages · 1 Juin 2011

Bonsoir,

J'appelle un background depuis ma feuille de style comme ceci :

    body {
    margin-top:24px;
    background-color:#FDFCFA;
    background:url(../templates/temp/img/bckgrd-TheNorthFace.jpg) top center no-repeat;
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
    line-height:1.5;
    }

Comment appliquer au background un lien hypertexte ?

Je suis preneur d'infos car je ne vois pas du tout.

Merci

Greg

**Dadou** · 1 Juin 2011

tu ne peux pas, en fait, c'est le contraire qu'il faut faire : appliquer un background à un lien hypertexte

ivoyages · 1 Juin 2011

tu ne peux pas, en fait, c'est le contraire qu'il faut faire : appliquer un background à un lien hypertexte

Ah ok.

ET je fais ça comment

J'ai tenté :

body {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:1.5;
}
.thenorthface{
margin-top:24px;
background-color:#FDFCFA;
background:url(../templates/temp/img/bckgrd-TheNorthFace.jpg) top center no-repeat;
display:block;
width:1903px;
height:930px;
}

et dans le html :

<a href="#"><div class="thenorthface"></div></a>

mais le background est au dessus du reste du tempalte :wacko:

MarvinLeRouge · 1 Juin 2011

Salut,

Alors,

Tu ne peux pas mettre un div dans un a (a est un élément inline donc ne doit contenir que des éléments inline)
En revanche, tu peux tout à fait donner à ton lien un aspect de type bloc
Et il va falloir que tu joues sur les z-index pour que le reste soit quand même au-dessus
Et tant qu'on y est, on met du contenu à ton lien

Ca donnerait un truc du style

<body>
<a class="thenorthface">du texte qui décrit bien ton lien</a>
<div class="wrapper">
Le reste de la page
</div>
</body>


.thenorthface {
position : fixed;
z-index : 1;
left : 0;
top : 0;
width : 100%;
height : 100%;
text-indent : -5000px;
overflow : hidden;
background : url("une image assez grande pour couvrir l'écran, de préférence conçue pour passer en repeat");
}
.wrapper {
position : relative;
z-index : 2;
}

Modifié 1 Juin 2011 par MarvinLeRouge

ivoyages · 2 Juin 2011

Salut,

Alors,

Tu ne peux pas mettre un div dans un a (a est un élément inline donc ne doit contenir que des éléments inline)

En revanche, tu peux tout à fait donner à ton lien un aspect de type bloc

Et il va falloir que tu joues sur les z-index pour que le reste soit quand même au-dessus

Et tant qu'on y est, on met du contenu à ton lien

Ca donnerait un truc du style
<body>
<a class="thenorthface">du texte qui décrit bien ton lien</a>
<div class="wrapper">
Le reste de la page
</div>
</body>
.thenorthface {
position : fixed;
z-index : 1;
left : 0;
top : 0;
width : 100%;
height : 100%;
text-indent : -5000px;
overflow : hidden;
background : url("une image assez grande pour couvrir l'écran, de préférence conçue pour passer en repeat");
}
.wrapper {
position : relative;
z-index : 2;
}

Merci pour le bout de code. Un pote l'a fait pour moi entre temps...

Connexion

Appliquer un lien hypertexte sur un background

Sujets conseillés

ivoyages

Dadou

ivoyages

MarvinLeRouge

ivoyages

Veuillez vous connecter pour commenter

Parcourir

Activité