Liens dans une feuille de style

cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007 - 1 févr. 2007 à 12:54
cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007 - 1 févr. 2007 à 15:21
Salut tout le monde,

Ce topic fait suite à celui-ci :  http://www.javascriptfr.com/infomsg_INTEGRER-HTML-DANS-CSS_881844.aspx#

J'ai un tableau mis en forme dans une feuille de style css. Dans ce tableau, j'ai deux cellules auxquelles je souhaiterais ajouter des liens :
- un lien pour la cellule1
- un lien pour la cellule2

Existe-t-il une manip' particulière pour intégrer les liens dans le CSS ? (si tant est que c'est possible). L'objectif est que ce tableau "répété" sur toutes les pages permettent en un clic d'aller sur d'autres sites Internet.

Histoire d'être plus complet, je vous transmets les lignes html suivantes (suivies du code css correspondant).







voici le html de mon petit tableau :





<html>
<head>
<title>exercice</title>
</head>

<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">

<div id="Tableau_01">
<div id="cellule1">
<img src="images/Sans-titre-1_01.gif" width="435" height="200" alt="">

</div>
<div id="cellule2">
<img src="images/Sans-titre-1_02.gif" width="465" height="200" alt="">
</div>
</div>

</body>
</html>

Puis voici le css qui est associé :

#Tableau_01 {

position:absolute;
left:0px;
top:0px;
width:900px;
height:200px;
}

#cellule1 {
position:absolute;
left:0px;
top:0px;
width:435px;
height:200px;
}

#cellule2 {
position:absolute;
left:435px;
top:0px;
width:465px;
height:200px;
}

Merci à toutes et à tous pour vos enrichissements / ajustements !

3 réponses

cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007
1 févr. 2007 à 13:00
Euh, excusez moi, mais le code était pas bon, c'est plutôt ceci :







Pour le html :





<html>
<head>
<title>exercice</title>
</head>

<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">

<div id="Tableau_01">
<div id="cellule1"></div>
<div id="cellule2"></div>
</div>

</body>
</html>

Pour le css:


#Tableau_01 {
position:absolute;
left:0px;
top:0px;
width:900px;
height:200px;
}

#cellule1 {
position:absolute;
background-image:url(../img/image de ma cellule1.gif);
left:0px;
top:0px;
width:435px;
height:200px;
}

#cellule2 {
position:absolute;
background-image:url(../img/image de ma cellule2.gif);
left:435px;
top:0px;
width:465px;
height:200px;
}

Voilà pour les corrections !
0
nickadele Messages postés 1251 Date d'inscription mercredi 7 août 2002 Statut Modérateur Dernière intervention 10 avril 2013
1 févr. 2007 à 13:45
Bonjour,

comme te l'a dit Bultez le CSS sert à la mise en page, étant donné qu'un lien se rapporte au contenu et non à la présentation, tu ne sauras pas les gérer au niveau du CSS.
Le résultat de ta page donnera donc un truc du style :
<head><title>exercice</title></head>

lien1lien2

</html>
0
cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007
1 févr. 2007 à 15:21
Bonjour Nickadele,

J'ai bien noté tes astuces. En fait, je suis débutant dans tous ces codes... Il me faut respecter un certain ordre au niveau des balises.

Avant, je m'obstinais à écrire :


//monsite.com

Résultat : rien ne fonctionne. Alors je me suis dis qu'il y avait certainement du CSS à modifier là dedans, d'où ma question sur ce post (mais vous avez raison, CSS = contenant et non contenu, j'ai compris la leçon)

Il suffisait d'écrire :
//monsite.com.... et répéter ça sur toutes les pages html comprenant l'élément

Résultat : ça fonctionne !
Constat : je me rends compte que j'suis vraiment paresseux et crois que le CSS peut tout faire à ma place !

Merci pour vos lumières

A+
0
Rejoignez-nous