Pays-Froid.Net

Qu'est ce que Pays-Froid.Net

Pays-Froid.Net › Les forums › Aide › (x)HTML

insérer une ilmage dans un tableu

Posez vos problèmes à propos du HTML et ses dérivés
Répondre

insérer une ilmage dans un tableu

Messagede yoyo86 le 24 Jan 2007 12:29

Bonjour à tous !!!

Voilà en ce moment j'essaye de me familiariser un peu plus avec photoshop, les tableaux ,... le graphisme en fait :D !!!

Mon problème est le suivant :

J'ai crée grâce a photoshop un background, je l'ai découper en plusieurs parties (qui correspondent a ma banniere, au menu, etc...) mais je n'arrive pas quand je fais mon code a insérer mon texte dans les parties découpées !!!

On m'a dit que l'on pouvait le faire grâce a un taleau mais chez moi ça ne marche pas du tout :cry: :cry: :cry: !!!!

Merci d'avance pour votre aide !!!
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut

Messagede Geoffroy le 24 Jan 2007 18:44

envoie le code de ta page et tes images découpé, pour qu'on puisse voir.
TIMTOWTDI
Avatar de l’utilisateur
Geoffroy
Crazy Pinguin
Crazy Pinguin
 
Messages: 1332
Inscription: 20 Jan 2007 23:11
Haut

Messagede Patoch le 24 Jan 2007 20:16

Bonjour Yoyo,

Un petit conseil, evite les tableaux. Montre moi tes images et ton code. je vais voir ce que je peux faire avec ca :)

envoi aussi ton css ;)
Image
Image
Avatar de l’utilisateur
Patoch
Administrateur
Administrateur
 
Messages: 1343
Inscription: 13 Nov 2006 1:53
Localisation: Sur la Banquise
Haut

Messagede Geoffroy le 24 Jan 2007 20:26

ben pourquoi pas en tableau??? ca va aussi non?
TIMTOWTDI
Avatar de l’utilisateur
Geoffroy
Crazy Pinguin
Crazy Pinguin
 
Messages: 1332
Inscription: 20 Jan 2007 23:11
Haut

Messagede Patoch le 24 Jan 2007 20:30

Biensur qu'un tableau ca marche :)

Mais un bon site sera fait en <div>. c'est plus simple au niveau du code ;)
Image
Image
Avatar de l’utilisateur
Patoch
Administrateur
Administrateur
 
Messages: 1343
Inscription: 13 Nov 2006 1:53
Localisation: Sur la Banquise
Haut

Messagede Geoffroy le 24 Jan 2007 20:39

ok, si tu le dis!
TIMTOWTDI
Avatar de l’utilisateur
Geoffroy
Crazy Pinguin
Crazy Pinguin
 
Messages: 1332
Inscription: 20 Jan 2007 23:11
Haut

Messagede yoyo86 le 24 Jan 2007 23:53

Bonsoir et merci d'avoir épondu !!!

Donc mon code est (je n'ai mis que la partie "lettres" car je pense que si jarrive acomprendre ca je reussirai avec le reste de ma page et en plus ca allege le post :

Code: Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>

<title>YOYO SOLUCES</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <link rel="stylesheet" media="screen" type="text/css" title="Design" href="pagepresentation.css" />
   </head>
   <body>
   
   
    <h2>Bonjour  ! </h2>   



<div id="corps">

          
<br> <br/>


    <table  width="100%"  align="center" >
        <tr>
                 
                  <td align="center" valign="top" width="1000px" height="2" bgcolor="#FFFFFF">
                   
                     <a href="Lettres/A/a.php">A</a> <a href="b.php">B </a> <a href="c.php">C </a>   <a href="Lettres/D/d.php">D </a> <a href="e.php">E </a> <a href="f.php">F </a>
                     <a href="g.php">G</a> <a href="h.php">H </a> <a href="i.php">I </a>   <a href="j.php">J </a> <a href="k.php">K </a> <a href="f.php">L </a>
                     <a href="m.php">M</a> <a href="n.php">N </a> <a href="o.php">O </a>   <a href="p.php">P </a> <a href="q.php">Q </a> <a href="r.php">R </a>
                     <a href="s.php">S</a> <a href="t.php">T</a> <a href="u.php">U </a>   <a href="v.php">V </a> <a href="w.php">W </a> <a href="x.php">X </a>
                     <a href="y.php">Y</a> <a href="z.php">Z </a>
                     </td>
                     
                      
      </tr>
   </table>

</div>



Je sais il doit y avoir des erreurs !! Je l'avoue, j'en fais souvent :oops: !!!



Mon code css :

Code: Tout sélectionner
body
{
   background-image:url("images/copie2.png");
   background-repeat:no-repeat;
   background-position :center;
   background-repeat:no-repeat ;
   margin:auto;
   margin-top:20px;
   margin-bottom:20px;
   width:1000px;
   font-family:"Comic Sans Ms", serif ;
   text-align:justify;
      
}


""""""""""""""""""""""""""""""""""""""


table
{
border-collapse: collapse;

}

td
{   border: 1px solid black;
}



Les images arrivent juste après !!!
Dernière édition par yoyo86 le 25 Jan 2007 0:47, édité 2 fois.
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut

Messagede yoyo86 le 25 Jan 2007 0:05

Bon les images ca n'a pas marché mais la ca va etre bon :

Background en morceaux :

http://img453.imageshack.us/img453/4854 ... 3010cy.gif

http://img453.imageshack.us/img453/1737 ... 3026fl.gif

http://img259.imageshack.us/img259/861/ ... 3037xk.gif

http://img453.imageshack.us/img453/6049 ... 3045wf.gif

http://img453.imageshack.us/img453/3457 ... 3051ts.gif

http://img453.imageshack.us/img453/7005 ... 3067hb.gif

http://img453.imageshack.us/img453/7287 ... 3070kp.gif

http://img235.imageshack.us/img235/9959 ... 3081ka.gif

http://img235.imageshack.us/img235/8407 ... 3090go.gif


Background en entier :

http://img259.imageshack.us/img259/6406/copie25ik.png
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut

Messagede Patoch le 25 Jan 2007 1:09

Essaye avec ca :

Pour le xHtml
Code: Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>

<title>YOYO SOLUCES</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <link rel="stylesheet" media="screen" type="text/css" title="Design" href="pagepresentation.css" />
   </head>
   <body>


    <h2>Bonjour  ! </h2>



<div class="corps">
   <img src="images/header.png" alt="" />
   <div class="menu">
      <a href="Lettres/A/a.php">A</a>
      <a href="b.php">B </a>
      <a href="c.php">C </a>
      <a href="Lettres/D/d.php">D </a>
      <a href="e.php">E </a>
      <a href="f.php">F </a>
        <a href="g.php">G</a>
      <a href="h.php">H </a>
      <a href="i.php">I </a>
      <a href="j.php">J </a>
      <a href="k.php">K </a>
      <a href="f.php">L </a>
        <a href="m.php">M</a>
      <a href="n.php">N </a>
      <a href="o.php">O </a>
      <a href="p.php">P </a>
      <a href="q.php">Q </a>
      <a href="r.php">R </a>
        <a href="s.php">S</a>
      <a href="t.php">T</a>
      <a href="u.php">U </a>
      <a href="v.php">V </a>
      <a href="w.php">W </a>
      <a href="x.php">X </a>
        <a href="y.php">Y</a>
      <a href="z.php">Z </a>
   </div>
</div>
</body>
</html>




pour le CSS
Code: Tout sélectionner
body
{
   background-color:#E2F2FD;
   margin:0 auto 0 auto;
   font-family:"Comic Sans Ms", serif ;
}

.corps
{
   background-image:url('images/corps.png');
   background-repeat:repeat-x;
   background-color:#6984C3;
   width:988px;
   height:100%;
   margin:0 auto 0 auto;
}

.menu
{
   border-top:1px solid #000000;
   border-bottom:1px solid #000000;
   text-align:center;
}
Image
Image
Avatar de l’utilisateur
Patoch
Administrateur
Administrateur
 
Messages: 1343
Inscription: 13 Nov 2006 1:53
Localisation: Sur la Banquise
Haut

Messagede yoyo86 le 25 Jan 2007 1:11

Ok !! merci beaucoup et j'essaye ça de suite !! Je te tiens au courant !!!
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut

Messagede Patoch le 25 Jan 2007 2:22

Je t'ai améliorer le code. Il est compatible avec IE et Firefox. Il est aussi valide XHTML et CSS apparement.

L'index.php
Code: Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>

<title>YOYO SOLUCES</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <link rel="stylesheet" media="screen" type="text/css" title="Design" href="pagepresentation.css" />
   </head>
   <body>
   
<div class="corps">
   <img src="images/header.png" alt="" />
   <div class="menu">
      <div class="heure">
      <?php
         $heure = date("H:i");
         Print("$heure");
      ?>
      </div>
      <div class="lettre">
         <a href="Lettres/A/a.php">A</a>
         <a href="b.php">B </a>
         <a href="c.php">C </a>
         <a href="Lettres/D/d.php">D </a>
         <a href="e.php">E </a>
         <a href="f.php">F </a>
           <a href="g.php">G</a>
         <a href="h.php">H </a>
         <a href="i.php">I </a>
         <a href="j.php">J </a>
         <a href="k.php">K </a>
         <a href="f.php">L </a>
         <a href="m.php">M</a>
         <a href="n.php">N </a>
         <a href="o.php">O </a>
         <a href="p.php">P </a>
         <a href="q.php">Q </a>
         <a href="r.php">R </a>
         <a href="s.php">S</a>
         <a href="t.php">T</a>
         <a href="u.php">U </a>
         <a href="v.php">V </a>
         <a href="w.php">W </a>
         <a href="x.php">X </a>
         <a href="y.php">Y</a>
         <a href="z.php">Z </a>
      </div>
      <div class="date">
      <?php
         $date = date("d/m/Y");
         Print("$date");
      ?>
      </div>
   </div>
   
   <div class="menugauche">
   <h1>Menu</h1>
   <ul>
   <li><a href="identification.php#Identification">&nbsp;Identification&nbsp;</a></li>
   <li><a href="recherche.php#rechercher">&nbsp;Rechercher&nbsp;</a></li>
   <li><a href="Livre d'or.php#Livre d'or">&nbsp;Livre d'or&nbsp;</a></li>
   <li><a href="Me contacter.php#Me contacter">&nbsp;Me contacter&nbsp;</a></li>
   </ul>
   </div>
</div>

</body>
</html>



Le CSS
Code: Tout sélectionner
body
{
   background-color:#E2F2FD;
   margin:0 auto 0 auto;
   font-family:"Comic Sans Ms", serif ;
}

.corps
{
   background-image:url('images/corps.png');
   background-repeat:repeat-x;
   background-position:bottom;
   background-color:#CAD5F1;
   width:988px;
   height:600px;
   margin:0 auto 0 auto;
   border-left:1px solid #000000;
   border-right:1px solid #000000;
}

.menu
{
   border-top:1px solid #000000;
   border-bottom:1px solid #000000;
   margin-top:-5px;
   color:#FFFFFF;
}

.heure
{
   text-align:left;
   margin-bottom:-22px;
   margin-left:4px;
}

.lettre
{
   text-align:center;
}

.date
{
   text-align:right;
   margin-top:-24px;
   margin-right:4px;
}

.menugauche
{
   float:left;
   margin-left:5px;
   border:1px solid #000000;
   text-align:center;
   margin-top:20px;
}

h1 { text-align:center; margin:0; font-size:medium; }

a { color:#FFFFFF; text-decoration:none; }
a:hover { color:#0383E6; }

ul , li { margin:0; padding:0; list-style-type:none; }
li a { margin:0; padding:0; }



Dis moi si tu rencontre un souci :)
casse pas tout, j'ai galerer pour comprendre ton javascript (qui en fait ne servait a rien, j'ai rempalcer par du php qui bouffera moins de ressources. :clope: )
Image
Image
Avatar de l’utilisateur
Patoch
Administrateur
Administrateur
 
Messages: 1343
Inscription: 13 Nov 2006 1:53
Localisation: Sur la Banquise
Haut

Messagede yoyo86 le 25 Jan 2007 2:29

Ouai y a juste un petit souci :
mes lettres ne sont pas séparées du header !!!!
Et est-kil serai possible de grossir un peu plus le menu ou de la séparer en deux??

En tout cas merci beaucoup !! tu me retires une épine du pied
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut

Messagede yoyo86 le 25 Jan 2007 2:31

Ah oui et pourquoi est-ce que le background il descend pas en bas de la page (là il s'arrête puis en dessous c'est tout blanc) ???
Et mon horloge elle apparait pas !!!!
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut

Messagede Patoch le 25 Jan 2007 3:02

Edit ton dernier post pour ajouter des info. ca evite les double post.

Merci :)
Le probleme a ete reglé par msn
La solution était tout simplement d'allumer easy php pour que le fichier php soit lu.
Image
Image
Avatar de l’utilisateur
Patoch
Administrateur
Administrateur
 
Messages: 1343
Inscription: 13 Nov 2006 1:53
Localisation: Sur la Banquise
Haut

Messagede yoyo86 le 25 Jan 2007 4:36

Donc je confirme !!! le probleme a été entièremetn règlé grâce à Patoch !!!
Encore un grand merci !!!!!!!!!!! :super:
Si quelqu'un avait le même problème je serai heureux de pouvoir renvoyer la balle et l'aider à résoudre son problème !!!!
A bientôt amis pingouins !!!
Image
yoyo86
Pinguin
Pinguin
 
Messages: 193
Inscription: 30 Nov 2006 0:54
Haut
Répondre

Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités

Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
Traduction par: phpBB-fr.com & phpBB.biz
phpBB SEO
cron

Copyright © Pays-Froid.Net

Nous contacter | Notre Histoire | Plan du site | Nos partenaires | Mentions légales | Fil RSS | XHTML 1.0 | CSS 2.0

Partenaire : Waliwaloo - Darklg - Yagoort - Meilleur du Web - Hit Parade