Design extensible

davloulou Messages postés 3 Date d'inscription   Statut Membre Dernière intervention   -  
webjonath Messages postés 47 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

je voudrais crer un desing extansible

j'ai deja tous essyer pour changer les px en pourcantage et rien ne vas
et je doit dire que la ca me casse vraiment la tête
seriez vous m'aidé

<!DOCTYPE html PUBLIC "" "">
<html xmlns="" xml:lang="fr" >
   <head>
       <title>CarpeNoKill</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">

body
{
   width: 1659px;
   margin: auto; 
   margin-top: 20px; 
   margin-bottom: 20px;    
   background-image: url("images/fond.png");
}

/* L'en-tête */

#en_tete
{
   width: 1659px;
   height: 140px;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: no-repeat;
   margin-bottom: 0px;
}

/* Le menu */

#menu
{
   float: left; 
   width: 128px; 
}

.element_menu
{
   background-color: #;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: repeat-20x;
   
   border: 0px solid black;
   
   margin-bottom: 20px; 
}

/* Quelques effets sur les menus */


.element_menu h3 
{    
   color: #F5E5B2;
   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: 25px;
   margin: 0px;
   margin-bottom: 5px;
}


.element_menu a 
{
   color: #F5E5B2;
}

.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: #ffffff; 
   background-image: url("");
   background-repeat: repeat-x; 
   
   border: 1px 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(""); 
   background-repeat: no-repeat; 
   
   padding-left: 30px;
   color: #B3B3B3;
   text-align: left;
}

/* Le pied de page */

#pied_de_page
{
   padding: 5px;

   text-align: center;

   color: #F5E5B2;
   background-color: #;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: repeat-x;
   
   border: 0px solid black;
}


</style>

   </head>
 
   <body>
 
       <!-- L'en-tête -->
 
       <div id="en_tete">
           
       </div>
 
       <!-- Les menus -->
 
       <div id="menu">        
           <div class="element_menu">
               <h3>Titre menu</h3>
               <ul>
                   <li><a href="page1.html">Lien</a></li>
                   <li><a href="page2.html">Lien</a></li>
                   <li><a href="page3.html">Lien</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>
 
       <!-- Le corps -->
 
       <div id="corps">
           <h1></h1>
       
           <p>
               <br />
               
           </p>
       
           <h2>Désolé notre site est en construction a bientôt.</h2>    
           <p>
              <br />
               
           </p>
           
           <h2></h2>    
           <p>
               <br />
               <br />
               <br />
               <br />
               <br />
               <br /> 
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br /> 
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
           </p>
       </div>
 
       <!-- Le pied de page -->
 
       <div id="pied_de_page">
           <p>Copyright "CarpeNoKill" 2009, tous droits réservés</p>
       </div>
 
   </body>
</html>

4 réponses

webjonath Messages postés 47 Date d'inscription   Statut Membre Dernière intervention   6
 
voila tu peut inséré ce script (il est extansible)
<!DOCTYPE html PUBLIC "" "">
<html xmlns="" xml:lang="fr" >
   <head>
       <title>CarpeNoKill</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">

body
{
   width: 100%;
   margin: auto; 
   margin-top: 20px; 
   margin-bottom: 20px;    
   background-image: url("images/fond.png");
}

/* L'en-tête */

#en_tete
{
   width: 100%;
   height: 140px;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: no-repeat;
   margin-bottom: 0px;
}

/* Le menu */

#menu
{
   float: left; 
   width: 128px; 
}

.element_menu
{
   background-color: #;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: repeat-20x;
   
   border: 0px solid black;
   
   margin-bottom: 20px; 
}

/* Quelques effets sur les menus */


.element_menu h3 
{    
   color: #F5E5B2;
   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: 25px;
   margin: 0px;
   margin-bottom: 5px;
}


.element_menu a 
{
   color: #F5E5B2;
}

.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: #ffffff; 
   background-image: url("");
   background-repeat: repeat-x; 
   
   border: 1px 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(""); 
   background-repeat: no-repeat; 
   
   padding-left: 30px;
   color: #B3B3B3;
   text-align: left;
}

/* Le pied de page */

#pied_de_page
{
   padding: 5px;

   text-align: center;

   color: #F5E5B2;
   background-color: #;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: repeat-x;
   
   border: 0px solid black;
}


</style>

   </head>
 
   <body>
 
       <!-- L'en-tête -->
 
       <div id="en_tete">
           
       </div>
 
       <!-- Les menus -->
 
       <div id="menu">        
           <div class="element_menu">
               <h3>Titre menu</h3>
               <ul>
                   <li><a href="page1.html">Lien</a></li>
                   <li><a href="page2.html">Lien</a></li>
                   <li><a href="page3.html">Lien</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>
 
       <!-- Le corps -->
 
       <div id="corps">
           <h1></h1>
       
           <p>
               <br />
               
           </p>
       
           <h2>Désolé notre site est en construction a bientôt.</h2>    
           <p>
              <br />
               
           </p>
           
           <h2></h2>    
           <p>
               <br />
               <br />
               <br />
               <br />
               <br />
               <br /> 
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br /> 
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
           </p>
       </div>
 
       <!-- Le pied de page -->
 
       <div id="pied_de_page">
           <p>Copyright "CarpeNoKill" 2009, tous droits réservés</p>
       </div>
 
   </body>
</html>

0
davloulou Messages postés 3 Date d'inscription   Statut Membre Dernière intervention  
 
ca vas pas le design est couper javais deja essayer
0
webjonath Messages postés 47 Date d'inscription   Statut Membre Dernière intervention   6
 
éssai ca..
<!DOCTYPE html PUBLIC "" "">
<html xmlns="" xml:lang="fr" >
   <head>
       <title>CarpeNoKill</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">

body
{
   width: 100%;
   margin: auto; 
   margin-top: 20px; 
   margin-bottom: 20px;    
   background-image: url("images/fond.png");
}

/* L'en-tête */

#en_tete
{
   width: 100%;
   height: 140px;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: no-repeat;
   margin-bottom: 0px;
}

/* Le menu */

#menu
{
   float: left; 
   width: 128px; 
}

.element_menu
{
   background-color: #;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: repeat-20x;
   
   border: 0px solid black;
   
   margin-bottom: 20px; 
}

/* Quelques effets sur les menus */


.element_menu h3 
{    
   color: #F5E5B2;
   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: 25px;
   margin: 0px;
   margin-bottom: 5px;
}


.element_menu a 
{
   color: #F5E5B2;
}

.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: #ffffff; 
   background-image: url("");
   background-repeat: repeat-x; 
   
   border: 1px 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(""); 
   background-repeat: no-repeat; 
   
   padding-left: 30px;
   color: #B3B3B3;
   text-align: left;
}

/* Le pied de page */

#pied_de_page
{
   padding: 5px;

   text-align: center;

   color: #F5E5B2;
   background-color: #;
   background-image: url("https://www.118712.fr/sortir.html");
   background-repeat: repeat-x;
   
   border: 0px solid black;
}


</style>

   </head>
 
<body>
 
       <!-- L'en-tête -->
 
    <div id="en_tete"><img src="https://www.118712.fr/sortir.html" width="100%" height="140">    </div>
 
       <!-- Les menus -->
 
       <div id="menu">        
           <div class="element_menu">
               <h3>Titre menu</h3>
               <ul>
                   <li><a href="page1.html">Lien</a></li>
                   <li><a href="page2.html">Lien</a></li>
                   <li><a href="page3.html">Lien</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>
 
       <!-- Le corps -->
 
       <div id="corps">
           <h1></h1>
       
           <p>
               <br />
               
           </p>
       
           <h2>Désolé notre site est en construction a bientôt.</h2>    
           <p>
              <br />
               
           </p>
           
           <h2></h2>    
           <p>
               <br />
               <br />
               <br />
               <br />
               <br />
               <br /> 
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
               <br /> 
               <br />
               <br />
               <br />
               <br />
               <br />
               <br />
           </p>
       </div>
 
       <!-- Le pied de page -->
 
       <div id="pied_de_page">
           <p>Copyright "CarpeNoKill" 2009, tous droits réservés</p>
       </div>
 
</body>
</html>

0
davloulou Messages postés 3 Date d'inscription   Statut Membre Dernière intervention  
 
non plus je me suis meme amusez a metre toute les valeur en poucentage je te dis pas le chiffre grrrrrrr ca casse la tete
0
webjonath Messages postés 47 Date d'inscription   Statut Membre Dernière intervention   6
 
oui mais en faite tu ne peut mettre en 100% une image en fond (en arière plan, ou tu peut ecrire desus) il fau la mettre par dessus est à ce momant la la mettre en 100% comme ton bandaux enhau mintnant il ce redimansione..
0