28173 sujets

CSS et mise en forme, CSS3

[resolu]Absurdité élémentaire : affichage d'une image de fond sous fi

Bonsoir,

Je ne parviens pas à afficher une image de fond sous firefox.
j'imagine que je dois oublier qqc d'élémentaire mais là je vois pas !
Le code simplissime est le suivant :

<html>
<body>

<table border="1" cellpadding="0" cellspacing="0" >
	<tr>
          <td background="img\test.jpg" >0</td>
        
  	  <td background="img\pt25\nord.bmp" width="125" height="125" >1</td>
        </tr>
</table>

</body>

</html>

et marche sous ie mais pas sous firefox.
ciao
Modifié par bouffon (08 Mar 2007 - 15:44)
Bonsoir .

Effectivement ca ne marche pas et c'est normal...

Tu dois avoir en haut de ta page (idéalement) quelque chose qui explique au navigateur dans quel "langage" est ton fichier HTML.

ca ressemble a ca :


<!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" lang="fr">


Suivant ce qu'il y a écrit la dedans ou bien encore s'il est absent, l'affichage n'est pas le même suivant les navigateurs , ce qui explique pourquoi IE ( plus tolérant aux non-standards) affiche et pas FF.

Quoi qu'il en soit et pour résoudre ton problème, tu devrais séparer la forme du contenu en utilisant les styles , par exemple , comme suit:



 <td style="background:url("img\pt25\nord.bmp") top left no-repeat;width:125px;height:125px" >1</td>
Salut,

Il faut que tu utilises le caractère "/" et non "\" pour séparer les répertoires. Il est probable que ton problème vienne de là.

Par contre, comme l'a dit RoseGrenouille un peu maladroitement, les feuilles de styles devraient te permettre plus de souplesse et un code plus propre. Smiley smile
RoseGrenouille a écrit :
Quoi qu'il en soit et pour résoudre ton problème, tu devrais séparer la forme du contenu en utilisant les styles , par exemple , comme suit:


 <td style="background:url("img\pt25\nord.bmp") top left no-repeat;width:125px;height:125px" >1</td>
Euh oui en effet, très bel exemple de séparation du contenu et de la présentation. Smiley rolleyes

A choisir, je préfère la solution d'origine (en plus tu as laissé les caractères "\").
Modifié par Julien Royer (07 Mar 2007 - 21:50)
A la suite d'une suggestion d'Igor, je précise que le format BMP ne fait pas partie de ceux que l'on peut intégrer dans des pages (X)HTML. Smiley biggol
a écrit :
très bel exemple de séparation du contenu et de la présentation. rolleyes


Bon bon bon, je vois qu'on est vigileant aux dérapages de langage même à cette heure ci....Après tout tant mieux.

@ Bouffon :

Pour repréciser quelque peu ma pensée une peu confuse Smiley biggol , il serait une bonne idée que tu puisse séparer la forme du contenu à l'aide de styles CSS .

Pour ce , il y a minimum 3 manières :

Ces styles peuvent être décrit en haut de chaque page XHTML à l'intéreur de la partie <head> au moyen de la balise <style>.

On peut également tous les mettre dans un fichier externe à la feuille HTML, appelée aussi feuille de style.

Pour "attacher" les styles à nos différents éléments , on procède comme suit, a l'aide de par exemple :

<element class="style">contenu</element>
<element id="style2">contenu</element>


Comme les styles sont séparés des éléments, nous avons ainsi un magnifique exemple de séparation du contenu !!!

Enfin et en dernier recours , il est possible de styler tes éléments au cas par cas , chaque élément un par un , comme l'exemple que je t'ai donné plu haut.
Cet exemple est tout a fait valide, sépare bien la forme du contenu, mais revient a écraser un bulldozer avec une mouche ( ou le contraire je ne sais plus trop ) Smiley lol . En gros a faire sur une page a un endroit précis si on ne veut pas se créer une classe ou un ID en CSS pour juste un tout petit changement local.
Bonjour,

Tout d'abord je vous remercie de m'avoir fournit des réponses aussi détaillées tous autant que vous êtes.

L'exemple, aussi simple était-il juste une page de test, bien sûr.

Ce qui explique que je n'avais pas pris la peine de mettre les en-têtes corrects : Et je suis au regret de vous informer que celà ne vient pas de là, j'ai qd mm fait le test !

Ce n'est pas non plus à cause de l'extension .bmp puisque j'ai fait la mm manip avec un jpg, que ca ne marche pas non plus.

Et pour ajouter un peu de piment à ce casse-tête, sachez que sur mon ordinateur de production, ie avec un localhost etc... eh bien celà fonctionnait !

Un grand merci donc à Julien : c'était bien les anti-slashs le problèmes : les slashs fonctionnent !!

Bonne journée
Sujet clos
Aller à