"logo actif " dans une feuille de style
peggysue
-
Gihef Messages postés 5165 Statut Contributeur -
Gihef Messages postés 5165 Statut Contributeur -
Bonjour à tous ,
Voici mon petit problème:
Les pages du site internet dont j'ai la charge , sont toutes reliées à un feuille de style CSS. Dans celle-ci j'utilise une image qui est le logo de l'association, elle se trouve dans l'entête.
voici le code que j'utlise:
#header #logo {
width: 223px;
float: left;
background: url('images/logo.gif') no-repeat #fff;
margin: 0 -3px;
height: 146px;
position: absolute;
z-index: 100;
}
je voudrais que cette image "logo" soit active, c'est à dire qu'il y est un lien dessus qui renvoie à l'index du site.
Mais voilà je n'y arrive pas. J'ai cherché sur différents forums mais je n'arrive pas à trouver de réponse à mon problème.Comment spécifier un lien dans le CSS ?
Merci à tous pour votre aide ! :)
Voici mon petit problème:
Les pages du site internet dont j'ai la charge , sont toutes reliées à un feuille de style CSS. Dans celle-ci j'utilise une image qui est le logo de l'association, elle se trouve dans l'entête.
voici le code que j'utlise:
#header #logo {
width: 223px;
float: left;
background: url('images/logo.gif') no-repeat #fff;
margin: 0 -3px;
height: 146px;
position: absolute;
z-index: 100;
}
je voudrais que cette image "logo" soit active, c'est à dire qu'il y est un lien dessus qui renvoie à l'index du site.
Mais voilà je n'y arrive pas. J'ai cherché sur différents forums mais je n'arrive pas à trouver de réponse à mon problème.Comment spécifier un lien dans le CSS ?
Merci à tous pour votre aide ! :)
A voir également:
- "logo actif " dans une feuille de style
- Modèle de style word - Guide
- Logo .net - Télécharger - Études & Formations
- Logo n - Guide
- Feuille de pointage excel - Télécharger - Tableur
- Jeu logo - Télécharger - Jeux vidéo
3 réponses
Bonjour,
Il me semble que ce n'est pas prévu.
Si je devais faire ça, j'utiliserais, dans le html, une image entièrement transparente que je positionnerais par dessus.
Une image avec les mêmes dimensions, au même emplacement et contenue dans une <a> pour le lien.
D'autres solutions ?
Il me semble que ce n'est pas prévu.
Si je devais faire ça, j'utiliserais, dans le html, une image entièrement transparente que je positionnerais par dessus.
Une image avec les mêmes dimensions, au même emplacement et contenue dans une <a> pour le lien.
D'autres solutions ?
Certain navigateur n'apprécie pas le png et ses transparences dégradées.
Mais, dans le cas présent, un gif fera l'affaire.
Une image entièrement de la même couleur, unie (blanc, noir…) et cette couleur définie comme transparente.
Pour la position, si les éléments concernés n'utilisent pas de “padding” ni de “border”, ça devrait passer.
Teste.
Mais, dans le cas présent, un gif fera l'affaire.
Une image entièrement de la même couleur, unie (blanc, noir…) et cette couleur définie comme transparente.
Pour la position, si les éléments concernés n'utilisent pas de “padding” ni de “border”, ça devrait passer.
Teste.
Et bien, une image transparente ne risque pas de créer de décalage, de recouvrement imparfait.
Si tu choisis de replacer la même image sur celle définie dans la feuille de styles, il y a comme redondance. Ça fait doublon, c'est inutile. Autant supprimer celle présente dans “background: url()”.
Cette image sera une nouvelle image.
Ton éditeur graphique préféré te permetta certainement de la créer et les options gif de définir la transparence.
Je te l'accorde par avance, c'est un peu tarabiscoté.
Si tu choisis de replacer la même image sur celle définie dans la feuille de styles, il y a comme redondance. Ça fait doublon, c'est inutile. Autant supprimer celle présente dans “background: url()”.
Cette image sera une nouvelle image.
Ton éditeur graphique préféré te permetta certainement de la créer et les options gif de définir la transparence.
Je te l'accorde par avance, c'est un peu tarabiscoté.
j'ai ouvert mon fichier template et j'y ai ajouter ce code:
<a href="/index.html"><img src="/images/logo.gif" width="223" height"146" position "absolute" float="left" z-index="100" border="0"></a>
avec donc la position exacte de l'image contenue dans le CSS. J'ai mis la même image par dessus. Et cela fonctionne !
Par contre quel est l'attribut pour que l'image est une transparence 0 ? Car j'ai peur que sous certains navigateurs, les deux images ne se superposent pas parfaitement ....
enfin sinon merci beaucoup ! ;)
Forum très utile , bravo !