5568 sujets

Sémantique web et HTML

Affichage image aux dimensions de la fenêtre

Bonjour,

Voila je voudrais afficher une page html avec une banniere (Banniere: image jpg, dans mon cas de 1024*200) qui se redimmensionne en fonction de la fenetre de mon navigateur ( et aussi en fonction de la résolution de l'utilisateur).
Mais apres plusieurs essai ma banniere ne se redimmensionne toujours pas...

Merci d'avance


Voici l'HTML:

   <head>
       <title>Play</title>
       <meta http-equiv="Content-Type" content="text/html;
 charset=iso-8859-1" />
	   	<!-- CSS-->
	   <link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />  
   </head>
 
   <body>
 
   <!--banniere -->
		<div id="banniere">
			<img src="banniere.jpg" alt="erreur image" />
		</div>
 
   <!-- reste-->
 		<div>

		</div>

   </body>
</html>

Et le CSS (pas tres fourni mais bon ...

body
{
	width:100%;
	margin:auto;
}

#banniere
{
	width: 100%;
}

#reste
{

}


<Edit par Florent V.: titre corrigé. Merci d'éviter le all-caps dans les titres et plus généralement sur le forum. />
Modifié par Florent V. (23 Nov 2007 - 09:54)
Ce n'est pas une trés bonne idée de redimensionner les images de cette maniére, leur aspect se dégrade beaucoup. Pourquoi? parce que ton écran à des points et que ces points correspondent aux pixels de l'images donc si il y moins de points pour plus de pixel, l'écran enléve des pixels...
Modifié par matmat (21 Nov 2007 - 22:46)
Salut,

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Dans ton code, c'est la DIV qui est à 100% et non l'image. Il faut donc faire :


#banniere img
{
	width: 100%;

}


Mais bon, comme dit plus haut, c'est pas vraiment recommandé d'utiliser le CSS pour modifier la taille des images.
Sujet clos
Aller à