voici pour le CSS :
* {
padding: 0; margin: 0;
}
body {
color: white;
background-color: #8c8c8c;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: small;
}
#wrapper {
color: black;
background-color: white;
}
#bandeau {
color: black;
background-color: #f3c600;
}
#bandeau img {
background-color: white;
}
h1 { font-size: 150%; }
h2 { font-size: 130%; }
strong { color: #4e9b88; }
address {
text-align: center;
font-size: 80%;
font-style: normal;
letter-spacing: 2px;
line-height: 1.5em;
}
a { text-decoration: none; outline: none; }
a:link { color: #d90000;}
a:visited { color: #cc6666; }
a:hover, a:focus { text-decoration: underline; }
a:active { color: white; background-color: #d90000; }
.skiplink { display: none; }
et voici pour la page index à laquelle ça devrait s'appliquer :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Little Boxes - page d'accueil</title>
<link href="littleboxes.css" rel="stylesheet" type="text/css" media="screen" />
<link href="version_impression.css" rel="stylesheet" type="text/css" media="print"/>
</head>
<body id="page_accueil">
<div id="wrapper">
<div id="bandeau">
<a href="#zone_de_texte" class="skiplink">Vers le contenu</a>
<h1>
<img src="logo.gif" title="Logo Little Boxes" alt="Little Boxes" width="222" height="32"/>
</h1>
<p>Créer des pages Web avec CSS. <span>Les bases.</span></p>
</div> <!-- Fin du bandeau -->
<div id="zone_de_navigation">
<ul>
<li id="navi01"><a href="index.html">Page d'accueil</a></li>
<li id="navi02"><a href="contact.html">Contact</a></li>
</ul>
</div> <!-- Fin de la zone de navigation -->
<div id="zone_de_texte">
<h2>Page d'accueil</h2>
<p>Les pages Web sont constituées de <strong>boîtes rectangulaires</strong> empilées les unes sur, à côté et dans les autres. Tous les éléments ronds sont des astuces, des images ou les deux.</p>
<p>Les étapes suivantes présentent la façon d'assembler les <em>boîtes</em> jusqu'à l'obtention d'une <em>page Web</em> finale :</p>
<ul>
<li>Fonctionnement du HTML</li>
<li>Principaux éléments HTML
<ul>
<li>Titres</li>
<li>Paragraphes et listes</li>
<li>Liens et images</li>
</ul>
</li> <!-- commence AVANT Principaux éléments HTML -->
<li>Mise en forme avec CSS</li>
</ul>
<p>Pour plus d'informations, visitez <a href="http://www.competencemicro.com" title="competencemicro.com - avec des exemples relatifs au cahier">mon site Web</a>.</p>
</div> <!-- Fin de la zonne de texte -->
<div id="pied_de_page">
<address>little boxes · fax 03574 34712</address>
</div> <!-- Fin du pied de page -->
</div><!-- fin de #wrapper -->
</body>
</html>
Modifié par Celine_21 (01 Jun 2010 - 11:59)
personne ne sait pourquoi ça ne fonctionne pas ??
Alors oui effectivement, finalement ça fonctionne, j'ai réessayé ma page et son style en dehors de dreamweaver, dans un dossier tout neuf. J'avais probablement un bug dans DW.