image arriere plan fixe a la cellule?!? |
|
| Voir le sujet précédent :: Voir le sujet suivant |
| Auteur |
Message |
Shadowshen shadmioche

|
image arriere plan fixe a la cellule?!? , Posté le: 16-09-2004 17:45 |
|
|
J'aurai vraiment besion d'un truc qui permette a mes images d'arriere plan de se rétréssire ou s'agrandire par rapport a la cellule.
Ma résolution c'est 1152 X 864. Mais par exemple en 1024 X 768 la cellule n'a pas la meme taille... alors elle se multiplie et fait tout foirer!!
Help!
Voir la saloperie ici: http://www.stskate.ca.cx [http://www.stskate.ca.cx]
P.S. ne vous etonnez pas vous aller tombé sur un site d'amateur. |
|
|
salemioche salemioche

|
image arriere plan fixe a la cellule?!? , Posté le: 16-09-2004 17:51 |
|
|
un petit coup de mais de Sibelius :
| Citation: |
Faire un arrière-plan étirable
Une image mise en arrière-plan (background-image) ne s'étire pas, elle ne fait que se dupliquer.
Pour réaliser un arrière-plan étirable, il faut utiliser une image (balise img) et non un background en CSS. Voici une méthode...
Le principe général est de donner les dimensions 100% à l'image, qui occupera alors toute la place de son conteneur (div, cellule,...). Ensuite, pour pouvoir afficher un texte par dessus, il faut donner une position à ce texte (absolu ou relatif).
Attention : avec cette méthode, l'image risque d'être très déformée puisque les proportions (hauteur / largeur) ne sont pas respectées.Si vous voulez que les proportions soient gardées, il vous suffit de ne spécifier que la dimension qui devra s'élargir (width OU height)... l'autre dimension va s'adapter mais dans ce cas n'occupera plus 100% de l'espace.
Un arrière plan sur le document entier (body)
| Code: |
<style type="text/css">
<!--
html, body {
margin:0;
padding:0;
height: 100%;
width: 100%;
}
#arriere{
/* l'image occupe toute la place du body */
width : 100%;
height: 100%;
}
-->
</style>
|
Le code HTML :
| Code: |
<img id="arriere" alt="" src="araignees.jpg" />
Un arrière plan sur un autre élément
(voir le résultat obtenu)
<style type="text/css">
<!--
html, body {
margin:0;
padding:0;
height: 100%;
width: 100%;
}
#arriere {
position: absolute; /* dimension et positionnement du bloc conteneur de l'image */
left: 10em;
top: 5em;
height : 20em;
width : 30em;
}
#arriere img {
/* l'image occupe toute la place de son bloc conteneur */
width : 100%;
height: 100%;
}
#arriere p {
position: absolute; /* placement du texte par-dessus l'image */
top: 1em;
left: 1em;
font-size: 1.5em;
color: white;
}
-->
</style>
</head>
<body>
<div id="arriere"><img alt="" src="image.png />
<p>titre sur une image en arrière-plan étirée <br />
Modifiez la taille du texte avec votre navigateur : l'image suit la cadence !</p>
</div>
</body>
</html> |
|
http://www.alsacreations.com/blog/index.php?2004/05/21/8-faire-un-arriere-plan-etirable.
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
Shadowshen shadmioche

|
image arriere plan fixe a la cellule?!? , Posté le: 16-09-2004 20:20 |
|
|
ohoh! Merci a salemioche et a Sibelus
Je vais essayer ca et je vous tien au courant! Merci bcp! |
|
|
|
|
S'enregistrer
Profil
Se connecter pour vérifier ses messages privés
Rechercher
Membres
FAQ
Connexion
|