Le CSS ne s'applique pas
Résolu
Visiteur
-
lejedidelingo Messages postés 189 Statut Membre -
lejedidelingo Messages postés 189 Statut Membre -
Bonjour,
Mon code CSS ne s'applique pas sur mon HTML. Quel est le problème?
Code HTML :
Code CSS :
Mon code CSS ne s'applique pas sur mon HTML. Quel est le problème?
Code HTML :
<div id="entete"> <ul id="navmenu"> <div id="mes1"><li><a href="index_es.html">Bienvenidos</a></li></div> <div id="mes2"><li><a href="about_es.html">Sobre Nosotros</a></li></div> <div id="mes3"><li><a href="contact_es.html">Contáctenos</a></li></div> </ul> </div>
Code CSS :
.mes1 a {
font-family: "century gothic";
font-size: 20px;
font-weight:normal;
color: #353535;
text-decoration: none;
text-align: center;
background-image: url(index_04.jpg);
float: left;
padding-top: 60px;
background-position:-22px 5px;
}
.mes1 a:hover {
text-decoration: none;
background:url(index_04_hover.jpg);
background-repeat: none;
background-position:-22px 5px;
}
.mes2 a {
font-family: "century gothic";
font-size: 20px;
font-weight:normal;
color: #353535;
text-decoration: none;
text-align: center;
background-image: url(index_04.jpg);
float: left;
padding-top: 60px;
background-position:-15px 5px;
}
.mes2 a:hover {
text-decoration: none;
background:url(index_04_hover.jpg);
background-repeat: none;
background-position:-15px 5px;
}
.mes3 a {
font-family: "century gothic";
font-size: 20px;
font-weight:normal;
color: #353535;
text-decoration: none;
text-align: center;
background-image: url(index_04.jpg);
float: left;
padding-top: 60px;
background-position:-23px 5px;
}
.mes3 a:hover {
text-decoration: none;
background:url(index_04_hover.jpg);
background-repeat: none;
background-position:-23px 5px;
}
1 réponse
-
coucou, il faut lier le css au html :)
De plus si tu veux faire un truc valable, il faut choisir le type de html (strict, transitional, ...)
allez c'est bien pck c toi :
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>ton title</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="entete">
<ul id="navmenu">
<div id="mes1"><li><a href="index_es.html">Bienvenidos</a></li></div>
<div id="mes2"><li><a href="about_es.html">Sobre Nosotros</a></li></div>
<div id="mes3"><li><a href="contact_es.html">Contáctenos</a></li></div>
</ul>
</div>
</body>
</html>
CSS : que tu auras appelé style.css (bien sur) :
.mes1 a {
font-family: "century gothic";
font-size: 20px;
font-weight:normal;
color: #353535;
text-decoration: none;
text-align: center;
background-image: url(index_04.jpg);
float: left;
padding-top: 60px;
background-position:-22px 5px;
}
.mes1 a:hover {
text-decoration: none;
background:url(index_04_hover.jpg);
background-repeat: none;
background-position:-22px 5px;
}
.mes2 a {
font-family: "century gothic";
font-size: 20px;
font-weight:normal;
color: #353535;
text-decoration: none;
text-align: center;
background-image: url(index_04.jpg);
float: left;
padding-top: 60px;
background-position:-15px 5px;
}
.mes2 a:hover {
text-decoration: none;
background:url(index_04_hover.jpg);
background-repeat: none;
background-position:-15px 5px;
}
.mes3 a {
font-family: "century gothic";
font-size: 20px;
font-weight:normal;
color: #353535;
text-decoration: none;
text-align: center;
background-image: url(index_04.jpg);
float: left;
padding-top: 60px;
background-position:-23px 5px;
}
.mes3 a:hover {
text-decoration: none;
background:url(index_04_hover.jpg);
background-repeat: none;
background-position:-23px 5px;
}
En fait ton erreur est juste le lien, il faut lier le html au css via cette ligne :
<link rel="stylesheet" type="text/css" href="style.css" />
lejedidelingo
étudiant en informatique
Si tu as d'autres question n'hésite pas