Liens dans une feuille de style

Signaler
Messages postés
11
Date d'inscription
jeudi 7 septembre 2006
Statut
Membre
Dernière intervention
7 novembre 2007
-
Messages postés
11
Date d'inscription
jeudi 7 septembre 2006
Statut
Membre
Dernière intervention
7 novembre 2007
-
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

Messages postés
11
Date d'inscription
jeudi 7 septembre 2006
Statut
Membre
Dernière intervention
7 novembre 2007

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 !
Messages postés
1251
Date d'inscription
mercredi 7 août 2002
Statut
Modérateur
Dernière intervention
10 avril 2013

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>
Messages postés
11
Date d'inscription
jeudi 7 septembre 2006
Statut
Membre
Dernière intervention
7 novembre 2007

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+