Le CSS ne s'applique pas [Résolu/Fermé]

Signaler
-
Messages postés
166
Date d'inscription
samedi 1 mai 2010
Statut
Membre
Dernière intervention
26 avril 2020
-
Bonjour,
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

Messages postés
166
Date d'inscription
samedi 1 mai 2010
Statut
Membre
Dernière intervention
26 avril 2020
6
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