Design - Dark-Slade - 06-08-2010
Salut , je suis nul en css , j'ai de grosses lacunes et j'essaie de faire le design de mon site mais le design ne s'affiche pas , j'en suis sur c'est tout bête mais je trouve pas :mauvais:
Voici le code html :
Code : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Mangas-Aventure !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="Design.css" />
</head>
<body>
<div id="en_tete">
</div>
<div id="menu">
<div class="element_menu">
<h3>Fairy tail</h3>
<ul>
<li><a href="file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/Mangas.html">Mangas</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/Auteur.html">Auteur</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/Éditeur.html">Éditeur</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/Personnages.html">Personnages</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/Guildes.html">Guildes</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/Personnages.html">Magies</a></li>
</ul>
</div>
<div class="element_menu">
<h3>Titre menu</h3>
<ul>
<li><a href="page4.html">Lien</a></li>
<li><a href="page5.html">Lien</a></li>
<li><a href="page6.html">Lien</a></li>
</ul>
</div>
</div>
<div id="corps">
<h1>Mangas-Aventure ! </h1>
<p>
Bienvenue sur mon super site !<br />
Vous allez adorer ici, c'est un site génial qui va parler de... heu... Je cherche encore un peu le thème de mon site :-D
</p>
<p>
A tout le monde ! Si je commence à privilégier certaines personnes, on va m'accuser de discrimination ;o)<br />
Que vous soyez fans de fusils à pulsion plasma ou de Barbie et Ken, ce site est fait pour vous ! Si si !
</p>
<p>
L'auteur du site ? Bah, c'est moi, quelle question :-p<br />
Je vais essayer de faire le meilleur site du monde (ça doit pas être bien compliqué). Mon objectif est d'attirer un maximum de visiteurs, de les rendre accros à mon site, puis de les mettre en mon pouvoir.<br />
Je prendrai ensuite le contrôle du Monde. Une fois que ce sera fait, j'irai explorer les confins de l'Univers à la recherche de nouveaux peuples à soumettre à ma terrible puissance. MooUUuUuuUAhahHaaAhAAaaah !!! (rire diabolique).
</p>
</div>
<!-- Le pied de page -->
<div id="pied_de_page">
<p>Copyright "Mangas-Aventure ! " 2010-2011, tous droits réservés</p>
</div>
</body>
</html>
Et le code css :
Code : body
{
width: 760px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
background-image: url("design.png");
}
/* L'en-tête */
#en_tete
{
width: 760px;
height: 100px;
background-image: url("design(2).png");
background-repeat: no-repeat;
margin-bottom: 10px;
}
/* Le menu */
#menu
{
float: left;
width: 120px;
}
.element_menu
{
background-color: #626262;
background-image: url("images/motif.png");
background-repeat: repeat-x;
border: 2px solid black;
margin-bottom: 20px;
}
/* Quelques effets sur les menus */
.element_menu h3
{
color: #B3B3B3;
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
text-align: center;
}
.element_menu ul
{
list-style-image: url("images/puce.png");
padding: 0px;
padding-left: 20px;
margin: 0px;
margin-bottom: 5px;
}
.element_menu a
{
color: #B3B3B3;
}
.element_menu a:hover
{
background-color: #B3B3B3;
color: black;
}
/* Le corps de la page */
#corps
{
margin-left: 140px;
margin-bottom: 20px;
padding: 5px;
color: #B3B3B3;
background-color: #626262;
background-image: url("images/motif.png");
background-repeat: repeat-x;
border: 2px solid black;
}
#corps h1
{
color: #B3B3B3;
text-align: center;
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}
#corps h2
{
height: 30px;
background-image: url("images/titre.png");
background-repeat: no-repeat;
padding-left: 30px;
color: #B3B3B3;
text-align: left;
}
/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */
#pied_de_page
{
padding: 5px;
clear: both;
text-align: center;
color: #B3B3B3;
background-color: #626262;
background-image: url("images/motif.png");
background-repeat: repeat-x;
border: 2px solid black;
}
Voila , merci de votre aide ^^
RE: Design - Kassak - 06-08-2010
Regarde le nom de ton fichier CSS, tu as déclaré Design.css, déjà enlève la majuscule, puis vérifie que les deux noms soient les même.
RE: Design - Dark-Slade - 06-08-2010
Bah j'ai changer en design sans la majuscule les 2 sont les mêmes mais sa ne marche pas quand même :/
RE: Design - manip - 06-08-2010
Ils sont bien dans le même dossier tes deux fichiers ? Parce que chez moi ça marche...
Sinon pense a enlever le "file:///C:/Documents%20and%20Settings/Coll%C3%A9gien/Mes%20documents/STEVE/Fairy%20tail%20!/" dans tes liens parce que quand tu passeras en ligne, ça ne marchera pas...
RE: Design - Thib4s - 06-08-2010
Trouvé
Code PHP : <?php
#en_tete
{
width: 760px;
height: 100px;
background-image: url("design(2).png");
background-repeat: no-repeat;
margin-bottom: 10px;
}
Doit devenir :
Code PHP : <?php
#en_tete
{
width: 760px;
height: 100px;
background-image: url("design_2.png");
background-repeat: no-repeat;
margin-bottom: 10px;
}
Tu ne peux pas mettre de parenthèse dans un nom d'image ^^
RE: Design - Dark-Slade - 06-08-2010
Mais en faite rien ne s'affiche sa donne blanc comme sa :
http://www.hostingpics.net/viewer.php?id=621640screen.png
RE: Design - popayan - 06-08-2010
peux tu faire un sceen de ton arborescence du répertoire?
sinon, juste une remarque en passant, si tu comptes faire du php, installe toi un wamp ou easyphp
RE: Design - Dark-Slade - 06-08-2010
(06-08-2010, 02:00 PM)popayan a écrit : peux tu faire un sceen de ton arborescence du répertoire?
sinon, juste une remarque en passant, si tu comptes faire du php, installe toi un wamp ou easyphp
Mais j'ai wamp , la on parle de design vous me parlez de php je comprend plus :heuuu:
<link rel="stylesheet" media="screen" type="text/css" title="design" href="design.css" />
Et mon fichier css c'est design.css sa devrait marcher non ?
RE: Design - Roworll - 06-08-2010
(06-08-2010, 02:04 PM)Dark-Slade a écrit : Et mon fichier css c'est design.css sa devrait marcher non ?
Est-ce que ton fichier design.css est dans le même dossier que ton fichier qui contient le code HTML ?
RE: Design - popayan - 06-08-2010
Je disais ca parce que tu mets tous tes liens en dur et en absolu, quand tu vas passer ton site sur wamp, faudra tout revoir!
ton fichier html et ton fichier css sont bien dans la même répertoire, c'est sur?
Essaie en mettant le chemin complet de ton fichier css dans le <link>
|