Guide informatique hardware En1heure.com
Articles phares : Quelle alimentation PC | Choisir son ecran LCD PC

Chercher un sujet :

creation site de base aide

Support HTML / XHTML / CSS et validation de vos sites aux standards du Web.

Messages: 4
Inscription: Mar Juil 27, 2010 4:31 am
creation site de base aideMessagePosté: Mar Juil 27, 2010 4:38 am

Bonjour a tous,

Voila je suis a la recherche d'une aide pour la réalisation de base du code html et de css pour le design suivant:

Image


je voudrais que ce soit flexible a l'intérieur, bien sur que ce sois compatible avec les navigateur ie , ff , O et chrome. On me parle de html5 et de css3 quis erais le mieux.

J'espere vraiment une aide de votre part et reste a votre disposition si question.[/img]
Avatar de l’utilisateur
Administrateur
Messages: 1614
Inscription: Ven Mar 26, 2004 7:16 am
Localisation: /var/www/
creation site de base aideMessagePosté: Jeu Juil 29, 2010 12:54 pm

Bonjour,

Quelle est la question ?
Tu veux qu'on te le fasse c'est ça ?

Messages: 4
Inscription: Mar Juil 27, 2010 4:31 am
creation site de base aideMessagePosté: Jeu Juil 29, 2010 5:57 pm

Bonjour, merci deja d'avoir repondu a mon post. Oi je voudrais bien qu'on me cree cela car je n'y arrive pas etje comprend pas le pourquoi. mais dans un futur proche je vais suivre des cours pour apprendre mais j'ai besoin de cela . bonne soiree.

Messages: 4
Inscription: Mar Juil 27, 2010 4:31 am
creation site de base aideMessagePosté: Dim Aoû 01, 2010 3:39 pm

Re bonjour a tous et a toutes,


voila j'ai essayecomme j'ai pu en etant novice et prenant exemple sur d'autre theme et ca donne ceci.


Sur Firefox
Image

Sur IE8
Image

fichier index.php
Code: Tout sélectionner
<?php
include_once 'common.php';
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Document sans titre</title>
<link href="style.css" rel="stylesheet" type="text/css" />
    <link href="lavalamp.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="js/jquery-1.1.3.1.min.js"></script>
    <script type="text/javascript" src="js/jquery.easing.min.js"></script>
    <script type="text/javascript" src="js/jquery.lavalamp.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#1, #2, #3").lavaLamp({
                fx: "backout",
                speed: 700,
                click: function(event, menuItem) {
                   return true;
                }
            });
        });
    </script>
</head>

<body>

<div class="header_right">
<h3>  Bienvenue  sur le site de lassociation Lesb-Gay Europe  </h3>
  </div>
<div class="logo">
        </div>
        <div class="content">
              <div class="topnav">
  <ul class="lavaLampWithImage" id="1">
    <li class="current"><a href="index.php"><?php echo LANG_MENU_HOME; ?></a></li>
               <li><a href="http://www.lesb-gay.eu"> <?php echo LANG_MENU_DIRECTORY; ?> </a></li>
               <li><a href="http://forum.lesb-gay.eu"> <?php echo LANG_MENU_BOARD; ?> </a></li>
               <li><a href="http://blog.lesb-gay.eu"> <?php echo LANG_MENU_BLOG; ?> </a></li>
               <li><a href="http://www.lesb-gay.eu"> <?php echo LANG_MENU_EVENTS; ?> </a></li>
               <li><a href="http://tchat.lesb-gay.eu"> <?php echo LANG_MENU_CHAT; ?> </a></li>
               <li><a href="http://rencontre.lesb-gay.eu"> <?php echo LANG_MENU_MEETING; ?> </a></li> 
                    <li><a href="http://galerie.lesb-gay.eu"> <?php echo LANG_MENU_GALLERY; ?> </a></li>
</ul>
      </div>
   
<div class="left">

         <div class="left_articles">TEST

         </div>
                  
         <div class="lt"></div>
         <div class="lbox">
            <div class="thumb">

            </div>
               
   
         </div>
                        
         <div class="lt"></div>
         <div class="lbox">

         <div class="thumb">
         </div>
         
         
         
         </div>
      </div>
      <div class="right">
                  
         <div class="rt">Login</div>
         <div class="right_articles">

         </div>
         <div class="rt">Calendrier</div>
         <div class="right_articles">

         </div>
         <div class="rt">Evenement</div>
         <div class="right_articles">

         </div>
      </div>   

<div class="footer">
              <?php
      echo '<p>' .'Copyright 2010 Association Lesb-Gay Europe &copy; 2007-'. date('Y'). '</p>';   
         ?>
</div>
</div>

</body>
</html>



Fichier Style.css
Code: Tout sélectionner
body {
   padding: 0;
   margin: 0;
   font: 0.74em Arial, Helvetica, sans-serif;
   line-height: 1.5em;
   background: #3F0923;
   color: #454545;
}

a {
   color: #4A8EBC;
   background: inherit;
}

a:hover {
   color: #C3593C;
   background: inherit;   
}

a.title {
   color: #FE6700;
   background: #FFF;
}

h1 {
   font: bold 2em "Trebuchet MS", Arial, Helvetica, sans-serif;
   letter-spacing: -1px;
   padding: 2px 0 0 0px;
   margin: 0;
   color: #464548;
   background: inherit;
}

h1 a, h2 a {
   text-decoration: none;
   color: #464548;
   background: inherit;
}

h1 a:hover, h2 a:hover {
   color: #C3593C;
   background: #FFF;
}

h1 .red{
   color: #C3593C;
   background: inherit;
}


h2 {
   margin: 0 0 5px 0;
   padding: 0;
   font: bold 1.5em Arial, Helvetica, sans-serif;
   letter-spacing: -1px;
   color: #000;
   background: inherit;
}

h2 .yellow{
   color: #FFFCD1;
   background: inherit;
}

p {   margin: 0 0 5px 0; }

ul {
   margin: 0;
   padding : 0;
   list-style : none;
}

form {
   margin: 0;
}


.content {
   margin: auto;
   width: 80%;
}
.logo {
   float: left;
   width: 20%;
   height: 72px;   
   padding: 0 0 0 0;
}
.header_right {
   float: right;
   width: 80%;
   height: 72px;
   color: #FFFFFF;
}
.logo p {
   font-size: 0.9em;
   color: #808080;
   padding: 0 0 0 7px;
   background: inherit;
}
.menu {
   clear: both;
   background-position:center;
   background-repeat:no-repeat;
   background:#3F0923 ;
   background-image:url(../images/menubar.png);
}
.topnav {
   background:url(../images/menubar.png) no-repeat;
    height:29px;
    width:916px;
    margin:auto;
   padding: 0 75px  0 0;
    }
.left {
   float: left;
   width: 80%;
   margin: 0 0 10px 0;
   padding: 0 20px  0 0px;
}
   .left_articles {
      margin: 0 0 15px 0;
      padding: 0 0 0 10px;
   }

   .lt {
      height: 10px;
      background: #6E6E6E url(lt.gif) no-repeat;
      color: #FFF;
   }
   
   .lbox {
      color: #eee;
      padding: 3px 12px;
      margin: 0 0 15px 0;
      background: #6E6E6E url(lb.gif) no-repeat bottom left;
      height: 178px;
   }
   
   .lbox a {
      color: #FFFCD1;
      background: inherit;
   }
   
   .lbox h2 {
      color: #FFF;
      background: #6E6E6E;
   }
   
   
.thumb {
   float: left;
   width: 150px;
   border: 1px solid #d4d4d4;
   color: #fff;
   background: #6e6e6e;
   margin: 0 15px 15px 0;
   padding: 5px;
}

.thumb p { margin: 0; padding: 3px; color: #FFF; background: #6e6e6e; }
   
.right {
   float: right;
   width: 15%;
   margin: 0 0 10px 0;
}
.right a {
   color: #FFFCD1;
   background: inherit;
}
   .rt {
      background: #C85E35 url(rt.gif) no-repeat;
      color: #FFF;
      height: 7px;
   }
      
   .right_articles {
      font-size: 0.9em;
      background: #C85E35 url(rb.gif) no-repeat bottom;
      color: #FEE1D5;
      padding: 4px 8px;   
      margin: 0 0 10px 0;
   }
   
         
.image {
   float: left;
   margin: 0 9px 3px 0;
}

.footer {
   clear: both;
   text-align: center;
   line-height: 1.8em;
   color: #FFCCFF;
   background:#490C2E;
   border:1px solid #280617;
   padding: 8px 0;
}

.footer a {
   color: #C3593C;
   background: inherit;
}



MErci de m'aider a faire presque comme mon image precedente
Avatar de l’utilisateur
Administrateur
Messages: 1614
Inscription: Ven Mar 26, 2004 7:16 am
Localisation: /var/www/
creation site de base aideMessagePosté: Mar Aoû 03, 2010 5:11 am

Heu, je sais bien faire tout ceci mais je facture quoi :shock:

Messages: 4
Inscription: Mar Juil 27, 2010 4:31 am
creation site de base aideMessagePosté: Mar Aoû 03, 2010 1:23 pm

tu veux dire ue ici on aide pas onfis payer les services? tu sais me repondre sur mon MP de clea.


MErci

si facture alors faut voir aussi le prix que tu demanderais.
Avatar de l’utilisateur
Administrateur
Messages: 1614
Inscription: Ven Mar 26, 2004 7:16 am
Localisation: /var/www/
creation site de base aideMessagePosté: Jeu Aoû 05, 2010 6:52 am

Ce que je veux dire c'est qu'ici, on aide mais de là à débuguer pour toi ou te crééer ta page, ça c'est un job!

Retourner vers HTML / XHTML / CSS



Chercher un sujet :


cron