je m'essaie aux CSS ... et je seche sur un petit probleme, alors pendant que je cherche et lit de la doc, je me dit que vous pourrez peut etre m'aider :
si je met tout cela ds une page web:
Code : Tout sélectionner
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<style type="text/css">
a.menu1 {
text-decoration:none ; /* supprime le soulignement des liens */
display:block ; /* Crée un retour à la ligne à la fin de chaque bouton */
background-color:#CC0000 ; /* couleur du bouton */
color:white ; /* couleur du texte */
font-size:15px ; /*taille du texte */
margin:0px ; /* la marge extérieur autour des boutons est =0 (les boutons se touchent) */
padding:4px; /* la marge intérieur autour des boutons est de 4 pixels*/
border:1px solid; /* il y a une bordure solide de 1 pixel autour de chaque bouton */
border-color:red black black red ; /* couleurs des 4 cotés des bordures, dans le sens des aiguilles d'une montre */
text-align:center; /* centre le texte de chaque bouton */
width:200px } /* fixe la largeur de chaque bouton à 200 pixel */
a.menu1:hover {
border-top:2px solid brown; /* change la couleur et l'épaisseur de la bordure haute lors du survol par la souris */
border-bottom:2px solid #CC0005 ; /* change la couleur et l'épaisseur de la bordure basse lors du survol */
padding:3px 4px 3px 4px } /* diminue la marge intérieure haute et basse du bouton survolé, pour compenser l'augmentation de la taille de la bordure */
</style>
</head>
<body>
<a class="menu1" href="">Accueil</a>
<a class="menu1" href="">Articles</a>
<a class="menu1" href="">Liens</a>
<a class="menu1" href="">Écrire</a>
</body>
</html>
je souhaite avoir les styles ds un fichier CSS alors je fait cela:
d'abord un fichier CSS, "test" ds le quel je colle cela:
Code : Tout sélectionner
a.menu1 {
text-decoration:none ; /* supprime le soulignement des liens */
display:block ; /* Crée un retour à la ligne à la fin de chaque bouton */
background-color:#CC0000 ; /* couleur du bouton */
color:white ; /* couleur du texte */
font-size:15px ; /*taille du texte */
margin:0px ; /* la marge extérieur autour des boutons est =0 (les boutons se touchent) */
padding:4px; /* la marge intérieur autour des boutons est de 4 pixels*/
border:1px solid; /* il y a une bordure solide de 1 pixel autour de chaque bouton */
border-color:red black black red ; /* couleurs des 4 cotés des bordures, dans le sens des aiguilles d'une montre */
text-align:center; /* centre le texte de chaque bouton */
width:200px } /* fixe la largeur de chaque bouton à 200 pixel */
a.menu1:hover {
border-top:2px solid brown; /* change la couleur et l'épaisseur de la bordure haute lors du survol par la souris */
border-bottom:2px solid #CC0005 ; /* change la couleur et l'épaisseur de la bordure basse lors du survol */
padding:3px 4px 3px 4px } /* diminue la marge intérieure haute et basse du bouton survolé, pour compenser l'augmentation de la taille de la bordure */
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="fr-fr">
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>accueil</title>
<link title="styles du site" rel="alternate stylesheet" href="test"
type="text/css">
</style>
</head>
<body>
<a class="menu1" href="">Accueil</a>
<a class="menu1" href="">Articles</a>
<a class="menu1" href="">Liens</a>
<a class="menu1" href="">Écrire</a>
</body>
</html>
pouvez vous me dire pourquoi ?
Merci !
Taltos
...