AccueilAccueil  FAQFAQ  RechercherRechercher  S'enregistrerS'enregistrer  MembresMembres  GroupesGroupes  Connexion  

Partagez | 
 

 Site en cours

Aller en bas 
AuteurMessage
Invité
Invité



MessageSujet: Site en cours   Août 29th 2008, 7:47 pm

Je ne savais pas trop ou poster ça, finalement je me suis dit que c'était le meilleur endroit.
Voici a quoi j'aimerai parvenir (le bleu ciel serait un image de fond)



y a du boulot hien ^^
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:02 pm

Non c'est plutôt simple au contraire.Tu veux que je t'aide maintenant ou tu préfère avoir mon tuto sur les table qui devrai arriver demain ou dimanche ?
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:11 pm

Je serais en exam du lundi 1er au 10 septembre alors je mets tous mes projets de coté en ce moment pour les reprendre après. Et alors je voudrais bien de ton aide.
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:16 pm

Ok alors tu as ton header et les boutons de ton menu ?
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:25 pm

oui tout et le blabla et copyright est une image (texte sur fond transparent)
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:32 pm

Le simple si t'es pressé c'est que je le fasse pour toi et que je te donne le code en mettannt en majuscule ce que tu peux modifié.
Donc héberge les images et passe moi ensuite les liens
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:33 pm

c'est super gentil mais je ne suis pas pressée et surtout j'aimerai apprendre.
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 8:41 pm

Très bien alors tu utilise quel logiciel ? (ex ceux que j'ai mis dans le tuto sur les I - Frames)
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 29th 2008, 9:36 pm

Nvu (par contre tu pourrais peut être m'aider pour autre chose, je te contact par mp)
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 30th 2008, 2:34 pm

Ca c'est cool comme ça tu seras pas obligé de tout codé.

1 - Ouvre Nvu
2 - U nouveau fichier se crée automatiquement va dans longlet source tu peux voir que le code suivant y est déja.

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title></title>
</head>
<body>

Pour avoir un tableau de base avec 1 ht et 2 colonnes sans espace entre les éléments tape ce code (je te met en majuscule les élément que tu peux modifiée) après le <body> .
Avec Nvu tu peux modifié toute ce que j'ai mis en majuscule en faisant Clic - Doit -> Propiétée cellulle

Code:
<table style="border-collapse: collapse; width: LARGEUR DE TABLEAU" px;"
border="LARGEUR DE LA BORDURE AUTOUR DU TABLEAU (SI TU EN VEUX UNE, SINON METTRE 0)" bordercolor="CODE COULEUR DE LA BORDURE" cellpadding="ESPACE CONSTANT ENTRE TON TEXTE (OU DE TON IMAGE COMME LE HEADER) ET LE BORD DU TABLEAU. METTRE 0 SI TU N'EN VEUX PAS"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: LARGEUR DU HAUT DU TABLEU (LA OU TU METS LE HEADER) px;" colspan="2">
      </td>
    </tr>
    <tr>
      <td colspan="1"
 style="vertical-align: top;width: LARGEUR DE LA COLONNE DE GAUCHE px; width: HAUTEURS DES 2 COLONNES px;">
<br>
      </td>
      <td colspan="1"
 style="vertical-align: top; width: LARGEUR DE LA COLONNE DE DROITE px;">
      </td>
    </tr>
  </tbody>
</table>

3 - Maintenant le remplir un peu :
a - D'abord le header

Mettre ce code

Code:
<img alt="NOM DU FICHIER"
 src="ADRESSE HTTP DU FICHIE (LIEN DU FICHIER)">

A cet emplacement

Code:
<table style="border-collapse: collapse; width: LARGEUR DE TABLEAU" px;"
border="LARGEUR DE LA BORDURE AUTOUR DU TABLEAU (SI TU EN VEUX UNE, SINON METTRE 0)" bordercolor="CODE COULEUR DE LA BORDURE" cellpadding="ESPACE CONSTANT ENTRE TON TEXTE (OU DE TON IMAGE COMME LE HEADER) ET LE BORD DU TABLEAU. METTRE 0 SI TU N'EN VEUX PAS"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: LARGEUR DU HAUT DU TABLEU (LA OU TU METS LE HEADER) px; width: HAUTEURS DES 2 COLONNES px;" colspan="2">
ICI

Pour les boutons il suffit de mettre ce code à la suite du header et ce pour chaque bouton
Code:
<a
 href="ADRESSE HTTP DU LIEN OU MèNE L'IMAGE (EX : ACCUEIL)" target="NOM DE L'EMPLACEMENT OU DOIT S'OUVRIR LE LIEN><img  alt="NOM DU FICHIER"
 src="ADRESSE HTTP DE L'IMAGE  (LIEN DE L'IMAGE)"></a>

A cet emplacement
Code:
<table style="border-collapse: collapse; width: LARGEUR DE TABLEAU" px;"
border="LARGEUR DE LA BORDURE AUTOUR DU TABLEAU (SI TU EN VEUX UNE, SINON METTRE 0)" bordercolor="CODE COULEUR DE LA BORDURE" cellpadding="ESPACE CONSTANT ENTRE TON TEXTE (OU DE TON IMAGE COMME LE HEADER) ET LE BORD DU TABLEAU. METTRE 0 SI TU N'EN VEUX PAS"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: LARGEUR DU HAUT DU TABLEU (LA OU TU METS LE HEADER) px;" colspan="2">
HEADER </BR> BOUTON 1 - 2 - ...... ETC
      </td>

b - Ensuite la colone de gauche.
Généralement je met mon menu mais tu peux y mettre ce que tu y veux
Dans le code ça donne ça
Code:
<table style="border-collapse: collapse; width: LARGEUR DE TABLEAU" px;"
border="LARGEUR DE LA BORDURE AUTOUR DU TABLEAU (SI TU EN VEUX UNE, SINON METTRE 0)" bordercolor="CODE COULEUR DE LA BORDURE" cellpadding="ESPACE CONSTANT ENTRE TON TEXTE (OU DE TON IMAGE COMME LE HEADER) ET LE BORD DU TABLEAU. METTRE 0 SI TU N'EN VEUX PAS"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: LARGEUR DU HAUT DU TABLEU (LA OU TU METS LE HEADER) px;" colspan="2">
HEADER </BR> BOUTON 1 - 2 - ...... ETC
      </td>
    </tr>
    <tr>
      <td colspan="1"
 style="vertical-align: top;width: LARGEUR DE LA COLONNE DE GAUCHEpx;">
BLABLABLA
      </td>

Pour la colonne de gauche (la page qui va se charger quand tu clique sur les boutons, entre ce code.

Code:
      <iframe
 src="URL DE TA PAGE QUI S'AFFICHERA DANS L'I - FRAME (IL S'AGIT LE PLUS SOUVENT DE CELLE DE LA PAGE D'ACCUEIL) ATTENTION NE PAS CHANGER L'URL"
 name="NOM DE LA FRAME" frameborder="0" height="HAUTEUR DE LA FRAME"
 width="LARGEUR DE L'I - FRAME"></iframe>

A cet emplacement

Code:
<table style="border-collapse: collapse; width: LARGEUR DE TABLEAU" px;"
border="LARGEUR DE LA BORDURE AUTOUR DU TABLEAU (SI TU EN VEUX UNE, SINON METTRE 0)" bordercolor="CODE COULEUR DE LA BORDURE" cellpadding="ESPACE CONSTANT ENTRE TON TEXTE (OU DE TON IMAGE COMME LE HEADER) ET LE BORD DU TABLEAU. METTRE 0 SI TU N'EN VEUX PAS"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: LARGEUR DU HAUT DU TABLEU (LA OU TU METS LE HEADER) px;" colspan="2">
HEADER </BR> BOUTON 1 - 2 - ...... ETC
      </td>
    </tr>
    <tr>
      <td colspan="1"
 style="vertical-align: top;width: LARGEUR DE LA COLONNE DE GAUCHE px;width: HAUTEURS DES 2 COLONNES px;">
BLABLABLA
      </td>
      <td colspan="1"
 style="vertical-align: top; width: 555px;">
ICI</td>
    </tr>
  </tbody>
</table>

Et fini la page par
Code:
</body>
</html>


Voila la partie code html est fini tu devrais avoir un code de ce genre
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title></title>
</head>
<body>
<table style="border-collapse: collapse; width: LARGEUR DE TABLEAU" px;"
border="LARGEUR DE LA BORDURE AUTOUR DU TABLEAU (SI TU EN VEUX UNE, SINON METTRE 0)" bordercolor="CODE COULEUR DE LA BORDURE" cellpadding="ESPACE CONSTANT ENTRE TON TEXTE (OU DE TON IMAGE COMME LE HEADER) ET LE BORD DU TABLEAU. METTRE 0 SI TU N'EN VEUX PAS"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: LARGEUR DU HAUT DU TABLEU (LA OU TU METS LE HEADER) px;" colspan="2">
HEADER </BR> BOUTON 1 - 2 - ...... ETC
      </td>
    </tr>
    <tr>
      <td colspan="1"
 style="vertical-align: top;width: LARGEUR DE LA COLONNE DE GAUCHE px;width: HAUTEURS DES 2 COLONNES px;">
BLABLABLA
      </td>
      <td colspan="1"
 style="vertical-align: top; width: 555px;">
EMPLACEMENT DE LA FRAME (LA PAGE)</td>
    </tr>
  </tbody>
</table>
</body>
</html>

Je te met un exemple concret de codage avec celui que j'utilise actuellement pour mon site
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="content-type"
 content="text/html; charset=ISO-8859-1">
  <title>Dream - Version 2 Kristen Bell</title>
</head>
<body
 style="background-image: url(http://img380.imageshack.us/img380/9972/26917abgk7.gif);">
<center>
<table style="border-collapse: collapse; width: 750px;"
 border="0" bordercolor="" cellpadding="0"
 cellspacing="0">
  <tbody>
    <tr>
      <td style="width: 555px;" colspan="2"><img
 style="width: 758px; height: 258px;" alt=""
 src="http://i42.servimg.com/u/f42/11/52/38/33/header26.jpg"></td>
    </tr>
    <tr>
      <td colspan="1"
 style="vertical-align: top; text-align: center; background-color: rgb(201, 203, 202); width: 200px;">
      <h1>Menu</h1>
      <a
 href="http://site.voila.fr/dream20/Home.html?0.8511720830101215"
 target="bloc">Home</a><br>
      <a
 href="http://site.voila.fr/dream20/Script.html?0.17007522486918136"
 target="bloc">Dreams
of script</a><br>
      <a
 href="http://site.voila.fr/dream20/Art.html?0.5020889640961524"
 target="bloc">Dreams
of arts</a><br>
      <a
 href="http://site.voila.fr/dream20/moi.html?0.6666381923318816"
 target="bloc">Moi
moi et moi</a><br>
      <a
 href="http://site.voila.fr/dream20/Dreams_notes.html?0.8661692515217287"
 target="_blank">Blablatages</a><br>
Faire mumuse ?<br>
Ressources<br>
      <a href="http://site.voila.fr/dream20/you.html"
 target="bloc">You</a><br>
      <a target="bloc"
 href="http://site.voila.fr/dream20/site.html?0.7163432560933604">Site</a><br>
Contact<br>
      <br>
      <h1>Site</h1>
Version 2 : Kristen Bell<br>
Par :&nbsp;<a href="http://kpweb.c.la/" target="_blank">Maryon</a><br>
Online : Lundi 6 Juillet<br>
      <br>
Site ouvert le : Lundi 7 Avril<br>
Webmaster : Lalita<br>
      <br>
      <h1>Link me</h1>
      <img style="width: 100px; height: 35px;" alt=""
 src="http://img139.imageshack.us/img139/9517/lien2ky3.gif">&nbsp;<img
 style="width: 100px; height: 35px;" alt=""
 src="http://i42.servimg.com/u/f42/11/52/38/33/bouton24.gif"><br>
      <br>
      <a
 href="http://site.voila.fr/dream20/lien.html?0.8362363968732662"
 target="bloc">Plus ?</a>
      <h1>Top</h1>
      <a href="http://alltosophelia.site.voila.fr/"
 target="_blank"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img76.imageshack.us/img76/5286/sanstitre2il7.gif"></a>&nbsp;
&nbsp;<a href="http://keran.site.voila.fr/"
 target="_blank"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img76.imageshack.us/img76/3331/sanstitre5ki0.gif"></a>&nbsp;
      <a href="http://kiarie.free.fr/dam/" target="_blank"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img76.imageshack.us/img76/6318/sanstitre6ys9.gif"></a>&nbsp;<a
 href="http://candies-awards.ze.cx/" target="_blank"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img292.imageshack.us/img292/1610/15634594su2.png"></a><br>
      <a
 href="http://site.voila.fr/dream20/devenir_part.html?0.1001217666891766"
 target="bloc"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img510.imageshack.us/img510/1609/sanstitre5gm6gc3.gif"></a>&nbsp;&nbsp;<a
 href="http://site.voila.fr/dream20/devenir_part.html?0.1001217666891766"
 target="bloc"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img510.imageshack.us/img510/1609/sanstitre5gm6gc3.gif"></a>&nbsp;
      <a
 href="http://site.voila.fr/dream20/devenir_part.html?0.1001217666891766"
 target="bloc"><img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img510.imageshack.us/img510/1609/sanstitre5gm6gc3.gif"></a>&nbsp;
      <a
 href="http://site.voila.fr/dream20/devenir_part.html?0.1001217666891766"
 target="bloc"> <img
 style="border: 0px solid ; width: 32px; height: 32px;" alt=""
 src="http://img510.imageshack.us/img510/1609/sanstitre5gm6gc3.gif"></a>
      <h1>Partenaires</h1>
      <h3>Dernier(s) ajout&eacute;(s)</h3>
      <a href="http://love-is-blindness.xooit.com/"><img
 style="border: 0px solid ; width: 100px; height: 35px;" alt=""
 src="http://img27.xooimage.com/files/3/d/7/but-samiiiir-5672fb.gif"></a>&nbsp;<a
 href="http://dangerous-temptation.forumotion.com/forum.htm"
 target="_blank"><img
 style="border: 0px solid ; width: 100px; height: 35px;" alt=""
 src="http://img71.imageshack.us/img71/5720/bouton1ej0.gif"></a>&nbsp;<a
 href="http://www.sibylline.fr/" target="_blank"><img
 style="border: 0px solid ; width: 100px; height: 35px;" alt=""
 src="http://www.sibylline.fr/images/liensiby2.jpg"></a>&nbsp;<a
 href="http://candies-awards.ze.cx/" target="_blank"><img
 style="border: 0px solid ; width: 100px; height: 35px;" alt=""
 src="http://img364.imageshack.us/img364/5976/tatianacandiesawards4bc7.gif"></a>&nbsp;<a
 href="http://art.kiwi.free.fr/" target="_blank"><img
 style="border: 0px solid ; width: 100px; height: 35px;"
 src="http://artkiwi.e3b.org/images/Art%20Kiwi_005.gif"
 alt="Art Kiwi, l'art &agrave; petit prix"></a>&nbsp;<a
 href="http://vie.en.couleurs.free.fr/" target="_blank"><img
 style="border: 0px solid ; width: 100px; height: 35px;"
 src="http://vie.en.couleurs.free.fr/www/logoversion2.2.jpg"
 alt=""> </a><br>
&nbsp;<a href="http://graphix-illusion.fr/"
 target="_blank"><img
 style="border: 0px solid ; width: 100px; height: 35px;"
 src="http://graphix-illusion.fr/boutons/100x35/v6b4.png" alt=""></a><br>
      <a target="bloc"
 href="http://site.voila.fr/dream20/Partenaires.html?0.9815487958351122">Plus
?</a> <a
 href="http://site.voila.fr/dream20/devenir_part.html?0.1001217666891766"
 target="bloc">Vous ?</a>
      <h1>Vote</h1>
      <a
 href="http://www.root-top.com/topsite/forumrpg/in.php?ID=2076"
 target="_blank"><img
 src="http://img.root-top.com/topsite/forumrpg/banner.gif"
 border="0"></a> <br>
      <a
 href="http://www.root-top.com/topsite/rannayang/in.php?ID=148"
 target="_blank"><img
 src="http://img.root-top.com/topsite/rannayang/banner.gif"
 border="0"></a> <br>
      <a href="http://www.root-top.com/topsite/dreams/in.php?ID=2"
 target="_blank"> <img
 src="http://img.root-top.com/topsite/dreams/banner.gif"
 border="0"></a><br>
      <br>
      <h1>Review</h1>
      <a href="http://minutes-blanches.net/reviews/"
 target="_blank"><img
 style="border: 0px solid ; width: 50px; height: 50px;" alt=""
 src="http://minutes-blanches.net/reviews/boutons/btn-review5.jpg"></a>&nbsp;<a
 href="http://catch-the-moon.ca.cx/" target="_blank"><small><img
 style="border: 0px solid ; width: 50px; height: 50px;" alt=""
 src="http://catch-the-moon.site.voila.fr/Design_site/CTMR.jpg"></small></a>
      <h1>Award</h1>
      <a href="http://catch-the-moon.ca.cx/" target="_blank"><img
 style="border: 0px solid ; width: 50px; height: 50px;" alt=""
 src="http://catch-the-moon.site.voila.fr/Design_site/CTMA1.jpg"></a><br>
      <a href="http://vie.en.couleurs.free.fr/"
 target="_blank"><br>
      </a>
      <h1>Tag</h1>
<!-- Begin ShoutMix - http://www.shoutmix.com --><iframe
 title="dream20" src="http://www4.shoutmix.com/?dream20"
 frameborder="0" height="500" scrolling="no"
 width="180">&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;a&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;View
shoutbox&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;/a&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;
      </iframe><br>
<!-- End ShoutMix --> </td>
      <td colspan="1"
 style="vertical-align: top; width: 555px; text-align: justify;">
      <iframe
 src="http://site.voila.fr/dream20/Home.html?0.8511720830101215"
 name="bloc" frameborder="0" height="2500"
 width="565"></iframe></td>
    </tr>
  </tbody>
</table>
</center>
</body>
</html>

et avec un peu de mise en page css ça peut donner ce résultat
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: Site en cours   Août 30th 2008, 6:12 pm

ouah super, si avec ça j'y arrive pas!!!
Revenir en haut Aller en bas
Contenu sponsorisé




MessageSujet: Re: Site en cours   

Revenir en haut Aller en bas
 
Site en cours
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Site de cours vidéos de Guitare & Mao
» Un site complet sur la langue grecque
» Site Koreacute
» LE site sur VDC !
» cours ou cotation

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Anna's Crossing :: .:¤~¤ Accélération... Vers d'autres horizons... ¤~¤:. :: Entraide :: Aide à la création de sites web-
Sauter vers: