Arrière page site web

**malgani** · 14/11/2009, 02h04

Bonjour,
j'ai un soucis lorsque je veux mettre une photo d'arrière plan dans un tableau celle ci est enorme et ne rentre pas dans le tableau, y aurait il un moyen pour que la photo s'adapte à la taille du tableau svp?

voici mon code:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<table cellpadding="0" cellspacing="0" width="1307" background="Fotolia_9600539_XXL.jpg" height="400">
    <tr>
        <td width="261">&nbsp;</td>
        <td width="261">&nbsp;</td>
        <td width="261">&nbsp;</td>
        <td width="261">&nbsp;</td>
        <td width="261">&nbsp;</td>
    </tr>
</table>

j'ai également un autre soucis c'est lorsque je réduis ma page tous les elements se déplacent et passent les uns sous les autres, comment peut on fixer TOUS les éléments de la page svp^^?

**dodelria** · 14/11/2009, 17h33

Ce n'est pas pour te décevoir, mais il est impossible de modifier la taille d'un arrière plan dynamiquement. Si ton tableau est à taille fixe, alors reduit toi même l'arrière plan, sinon, il faudrat trouvé une autre solution.

Pour ton 2em problème, essaye de mettre tes bloc avec une largeur et une hauteur avec des pourcentages, ou alors, donne leur une taille fixe et met les
dans des bloc plus grand, et tu mettras ces derniers avec une taille fixe aussi.
Sinon, met ceci en CSS : (Je ne suis pas sur de mon coup

)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
body
{
overflow: scrolling;
}

Je te le conseille pas trop, mais bon ...

**FredPsy** · 15/11/2009, 20h54

Envoyé par malgani

(...) comment peut on fixer TOUS les éléments de la page svp^^?

Bonsoir, tu peux faire ça en CSS avec le tag :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
position:absolute; /** et par exemple */
top:10px;
left:300px;

Dans ce code, l'élément sera positionné à 10px du haut de la page
et à 300px à gauche. Même si tu réduis la fenêtre, l'élément ne bougera pas.

**Vil'Coyote** · 16/11/2009, 17h19

Salut,
je suis d'accord avec FredPsy cependant, j'espère que ton image à la base ne fait pas 1Mo ou plus car après bonjour le chargement.

Si celle ci est une couleur uni opte plutôt pour le css sans image.

**malgani** · 18/11/2009, 19h54

merci pour vos réponses mais je n'arrive toujours pas à fixer tous les élements de ma page, je vous donne mon code html si quelqu'un peut m'aider svp:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!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>Cabinet MOREL SINICO</title>
       <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
       <link rel="stylesheet" media="screen" type="text/css" title="Design" href="MENU.css" />
 
 
	   <meta name="generator" content="namo webeditor(trial)" />
<script language="JavaScript" type="text/javascript">
<!--
function na_preload_img()
{ 
  var img_list = na_preload_img.arguments;
  if (document.preloadlist == null) 
    document.preloadlist = new Array();
  var top = document.preloadlist.length;
  for (var i=0; i < img_list.length-1; i++) {
    document.preloadlist[top+i] = new Image;
    document.preloadlist[top+i].src = img_list[i+1];
  } 
}
 
function na_change_img_src(name, nsdoc, rpath, preload)
{ 
  var img = eval((navigator.appName.indexOf('Netscape', 0) != -1) ? nsdoc+'.'+name : 'document.all.'+name);
  if (name == '')
    return;
  if (img) {
    img.altsrc = img.src;
    img.src    = rpath;
  } 
}
 
function na_restore_img_src(name, nsdoc)
{
  var img = eval((navigator.appName.indexOf('Netscape', 0) != -1) ? nsdoc+'.'+name : 'document.all.'+name);
  if (name == '')
    return;
  if (img && img.altsrc) {
    img.src    = img.altsrc;
    img.altsrc = null;
  } 
}
 
// -->
</script>
 
</head>
 <body bgcolor="white" text="black" link="blue" vlink="purple" alink="red" onload="na_preload_img(false, 'file:///c|/users/admin/documents/namo%20morel%20sinico/vac.png');">
 <body background="fond.png">
 <body bgcolor="white" text="black" link="blue" vlink="purple" alink="red" onload="na_preload_img(false, 'premiere%20page.png');">
 
   <p align="center"><b><font color="white"><span style="font-weight:bold;"><img src="entete.png" width="250" height="123" border="0" /></span></font></b></p>
<table cellpadding="0" cellspacing="0" background="barre ok.png" align="center" width="988">
    <tr>
        <td width="200">
            <p align="center"><a href="index.htm" style="text-decoration:none">ACCEUIL</a></p>
</td>
        <td width="200">
            <p align="center"><a href="nos missions.htm" style="text-decoration:none">NOS MISSIONS</a></p>
</td>
        <td width="200">
            <p align="center"><a href="qui sommes nous.htm" style="text-decoration:none">QUI SOMMES NOUS ?</a></p>
</td>
        <td width="200">
            <p align="center"><a href="contact.htm" style="text-decoration:none">CONTACT</a></p>
</td>
        <td width="200">
            <p align="center"><a href="http://93.17.89.75/" style="text-decoration:none"><font color="black">MON ESPACE</font></a></p>
</td>
    </tr>
</table>
   <p align="center">&nbsp;<b><font color="white"></font></b></p>
 
 
<p align="center"><a href="#" onmouseout="na_restore_img_src('image1', 'document')" onmouseover="na_change_img_src('image1', 'document', 'file:///c|/users/admin/documents/namo%20morel%20sinico/vac.png', true)"><img src="pile.png" width="907" height="416" border="0" name="image1" id="image1" /></a></p>
<ul>
    <p align="center"><img src="jj.png" width="170" height="208" border="0" align="left" />&nbsp;<img src="22.png" width="170" height="208" border="0" />&nbsp;<img src="33.png" width="170" height="208" border="0" align="right" /></p>
 
 
 
 
 
 
 
 
 
 
 
</ul>
</body>

**FredPsy** · 18/11/2009, 20h04

Bonjour, peux-tu faire un zip avec le code, les images et le CSS.

Il manque trop de choses pour pouvoir t'aider.

Envois le zip en MP.

Je mettrai la réponse ici de toute façon.

**cssman** · 20/11/2009, 21h09

Ouh la le code !!!

Avant même d'essayer de résoudre ce problème d'image de fond, il faut reprendre tout à la base.

- Trois <body> ? Rien que ça ? Un seul suffira...

(il n'en faut qu'un seul en fait)
- Le doctype choisi est du xhtml 1.0 strict, il faudrait savoir à quoi cela correspond et le respecter (entre autre, les balises <font> sont invalides en mode strict, les align="center" aussi)
- La mise en page par tableaux est-elle nécessaire ? Il y a tout de même les CSS pour ça. Les tableaux doivent être réservés pour les vrais tableaux de données. Ou alors, encore une fois, pas la peine de choisir du xhtml 1.0 strict.
- les espaces dans les noms de fichiers, les chemins relatifs au disque dur, pas très bons non plus !
- l'écriture en majuscules est aussi déconseillée. Outre qu'elle veut signifier qu'on crie, c'est aussi et surtout plus difficilement lisible que des caractères minuscules.

Bref, il y a peut-être beaucoup de choses à revoir avant de s'attaquer à ce problème d'image de fond, non ?

Arrière page site web

HTML

Vue hybride

Discussions similaires

Partager

Partager