Voila mon index:
< !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" >
< !-- Demarrage de la page HTML -->
< !--
//////////////////////////////////////////////////
//////////////////////////////////////////////////
////////////////////////////// Cette page est sous la protection d´un copyright, elle est la possession de Webown©. Vous ne pouvez la vendre sans autorisation de la part des / / Webmasters de Webown. Bon site !
//////////////////////////////////////////////////
//////////////////////////////////////////////////
////////////////////////////
-->
<head>
<title>Nintendo Zone</title><!-- Titre de la page en haut du navigateur -->
<meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-1"/><!-- Meta qui permet de mettre des accents dans la page -->
<link href="css/style.css" rel="stylesheet" type="text/css" / ><!-- Appel de la feuile de style -->
</head>
<body>
<!-- Démarrage du corps de la page -->
<!-- Début du bloc header où il y le logo -->
<div id="header">
<div id="header_gauche"></div>
<div id="banniere"><img src="image/logo.gif" alt="logo Nintendo Zone" / ><!-- Insertion du logo dans la page --></div>
<div id="header_droite"></div>
</div>
<!-- Fin du bloc header -->
<!-- Début du bloc pour le texte défilant -->
<div id="defile_zone"><marquee behavior="alternate" id="texte_defile">Bienvenue sur Nintendo Zone</marquee></div>
<!-- Fin du bloc de texte défilant -->
<!-- Début de la partie où se trouve les menus et les cadres -->
<table>
<tr>
<td>
<!-- Début de la partie des menus de gauche -->
<div id="gauche">
<!-- Début d´un menu -->
<div>
<div class="haut_menu"><span class="titre_menu">menu</span></div>
<div class="milieu_menu">
<span class="liens_menu">
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
</span>
</div>
<div class="bas_menu"></div>
</div>
<!-- Fin d´un menu -->
<!-- Début d´un menu -->
<div>
<div class="haut_menu"><span class="titre_menu">menu</span></div>
<div class="milieu_menu">
<span class="liens_menu">
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
<a href="#">lien</a><br/>
</span>
</div>
<div class="bas_menu"></div>
</div>
<!-- Fin d´un menu -->
</div>
<!-- Fin de la partie gauche -->
</td>
<td>
<!-- Début de la partie des cadres au centre -->
<div id="centre">
<!-- Début d´un cadre -->
<div>
<div class="haut_cadre"></div>
<div class="milieu_cadre">
<span class="titre_cadre">Nintendo Zone</span><!-- Toujours mettre le titre entre les span -->
<span class="texte_cadre">
Bienvenue sur le Kit Nintendo Zone. Il représente les couleurs de la GameCube violette et de la Nintendo DS.
</span><!-- Toujours mettre le texte entre les span -->
</div>
<div class="bas_cadre"></div>
</div>
<!-- Fin d´un cadre -->
<!-- Début d´un cadre -->
<div>
<div class="haut_cadre"></div>
<div class="milieu_cadre">
<span class="titre_cadre">Charte webown</span><!-- Toujours mettre le titre entre les span -->
<span class="texte_cadre">
1) Un design clair, soigné, et de qualité.<br/>
2) Un code le plus simple possible et sans erreurs.<br/>
3) Tout ceci 100% gratuit!<br/>
Si vous avez un problème concernant ce kit, n´hésitez pas à nous le signaler sur le forum.Vous pouvez utiliser ce kit librement dans un but non lucratif, toute distribution est donc interdite sans notre consentement.<br/>
Merci et bon site !
</span><!-- Toujours mettre le texte entre les span -->
</div>
<div class="bas_cadre"></div>
</div>
<!-- Fin d´un cadre -->
</div>
<!-- Fin de la partie centrale -->
</td>
<td>
<!-- Début de la partie driote des menus -->
<div id="droite">
<!-- Début d´un menu -->
<div>
<div class="haut_menu"><span class="titre_menu">menu</span></div><!-- Toujours mettre les titres entre les span -->
<div class="milieu_menu">
<span class="liens_menu">
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
</span><!-- Toujours mettre les liens entre les span -->
</div>
<div class="bas_menu"></div>
</div>
<!-- Fin d´un menu -->
<!-- Début d´un menu -->
<div>
<div class="haut_menu"><span class="titre_menu">menu</span></div><!-- Toujours mettre les titres entre les span -->
<div class="milieu_menu">
<span class="liens_menu">
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
<a href="#">lien</a><br / >
</span><!-- Toujours mettre les liens entre les span -->
</div>
<div class="bas_menu"></div>
</div>
<!-- Fin d´un menu -->
</div>
<!-- Fin de la partie de droite -->
</td>
</table>
<!-- Début de la partie où se trouve la signature -->
<div id="footer"><p>Designed and coded by OGY for < a href="webown.free.fr" id="link">Webown©</a>
</div>
<!-- Fin de la partie où se trouve la signature -->
<!-- Fin du corps de la page -->
</body>
< !-- Fin de la page -->
< /html>
Puis ma feuille de style css:
/ *
::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::
/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/:
:/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/
::/::/::/::/::/::/::/::/::/::
:: Cette feuille de style est sous la protection d´un copyright, elle est la possession de Webown©. Vous ne pouvez la vendre sans autorisation de la ::part des Webmasters de Webown. Bon site !
::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::
/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/:
:/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/::/
::/::/::/::/::/::/::/::/::/::
/ * Mise en place du fond de la page */
body{
background-image: url(´../image/fond.gif´);
margin: 0px;
}
/ * Mise en position du header */
- header{
margin-bottom: 10px;
}
/ * Mise en place de l´image de la DS en haut à gauche */
- header_gauche{
background-image: url(´../image/header_gauche.gif´);
background-repeat: no-repeat;
background-position: top left;
width: 185px;
height: 158px;
}
/ * Mise en position de la baniérre */
- banniere{
margin-left: 200px;
margin-top: -150px;
}
/ * Mise en place de l´image de la GameCube en haut à droite */
- header_droite{
background-image: url(´../image/header_droite.gif´);
background-repeat: no-repeat;
background-position: top right;
width: 166px;
height: 197px;
margin-top: -158px;
margin-left: 842px;
}
/ * Mise en place de l´image de fond pour le texte défilant */
- defile_zone{
background-image: url(´../image/defile_zone.gif´);
width: 932px;
height: 43px;
margin: auto;
}
/ * Mise en place du texte défilant */
- texte_defile{
display: block;
padding-top: 10px;
}
/ * Mise en position de la partie gauche */
- gauche{
margin-top: 0px;
margin-left: 10px;
}
/ * Mise en place du haut des menus */
. haut_menu{
background-image: url(´../image/haut_menu.gif´);
background-repeat: no-repeat;
width: 181px;
height: 37px;
}
/ * Mise en place du milieu des menus */
. milieu_menu{
background-image: url(´../image/milieu_menu.gif´);
background-repeat: repeat-y;
width: 181px;
}
/ * Mise en place du bas des menus */
. bas_menu{
background-image: url(´../image/bas_menu.gif´);
background-repeat: no-repeat;
width: 181px;
height: 20px;
}
/ * Mise en forme des titres de menu */
. titre_menu{
font-family: " Comic Sans MS", sans-serif;
font-size: 1.5em;
text-align: center;
display: block;
}
/ * Mise en forme des liens */
. liens_menu{
font-family: " Comic Sans MS", sans-serif;
font-size: 0.8em;
text-decoration: none;
text-align: center;
display: block;
}
/ * Mise en position de la partie centrale */
- centre{
margin-top: 20px;
margin-left: 20px;
}
/ * Mise en place du haut des cadres */
. haut_cadre{
background-image: url(´../image/haut_cadre.gif´);
background-repeat: no-repeat;
width: 552px;
height: 21px;
}
/ * Mise en place du milieu des cadres */
. milieu_cadre{
background-image: url(´../image/milieu_cadre.gif´);
background-repeat: repeat-y;
width: 552px;
}
/ * Mise en place du bas des cadres */
. bas_cadre{
background-image: url(´../image/bas_cadre.gif´);
background-repeat: no-repeat;
width: 552px;
height: 20px;
}
/ * Mise en forme des titres des cadres */
. titre_cadre{
font-family: " Comic Sans MS", sans-serif;
font-size: 1.2em;
text-align: center;
display: block;
}
/ * Mise en forme du texte dans les cadres */
. texte_cadre{
padding-left: 20px;
padding-right: 20px;
padding-bottom: 10px;
padding-top: 10px;
text-align: justify;
display: block;
}
/ * Mise en position de la partie de droite */
- droite{
margin-top: 0px;
margin-left: 20px;
}
/ * Mise en forme du texte de signature \\//A ne pas modifier S.V.P ! !! \\// */
- footer{
font-family: " Comic Sans MS", sans-serif;
font-size: 0.7em;
color: #ceced0;
width: 300px;
margin-left: 405px;
}
/ * Mise en forme du lien vers Webown \\// A ne pas modifier S.V.P ! !! \\// */
- link{
text-decoration: none;
color: #ceced0;
}
- link:hover{
text-decoration: underline;
color: #dc9951;
}
![[Flashrider]](https://image.jeuxvideo.com/avatar-md/default.jpg)
