Aller au contenu

Image de fond !


Sujets conseillés

Guest ksper92
Posté

Bonjour à tous,

je vous explique mon problème...

J'ai créé une page avec css qui comporte un bandeau de titre en haut, une colonne à gauche, une centrale, une à droite et un bandeau en bas.

J'aimerais pour cette page avoir une image de fond (dans le body et dans mes 5 autres zones (top, left, middle, right et bottom)) pour que mon texte soit au dessus et que l'image de fond soit toujours visible.

J'espère avoir été assez clair dans ma demande.

Si vous avez une idée et surtout si c'est possible, merci de me donner des infos car là, je ne sais plus que tester :(

Posté

si j'ai bien compris tu mets ton image en fond sur le body et tu ne mets rien sur les 5 zones (ni image ni couleur)

Posté (modifié)

ce serait bien si tu avais un lien vers une maquette (même temporaire) de ta page histoire de voir le look cherché, le code de ta maquette, les feuilles de style, et tout ça.

mis à vue de nez ton fond ne pourra pas être visible derrière les images bandeau ou autres).

si cela ne te gêne pas, il ne te reste plus qu'à faire un découpage de ton image de fond par zone en les plaçant dans tes sections de mise en page, à condition qu'elles soient fixes (en pixel) si ton image de fond fait moins de 1600x1200 (sinon tu pourrais bidouiller en pourcentage pour faire un layout élastique, que j'affectionne).

les meilleurs pour découper par zone fixe, franchement, et même s'il y en a d'autres, sont photoshop (ou image ready) ou fireworks : tu quadrilles avec l'outil "couteau" ton image, traçant des rectangles reprenant la taille et la position de tes zones. ensuite tu enregistres en jpeg le découpage et tu obtiens autant d'images que de zones. that's all folks.

sinon un fond uni et unique est affiliable via une feuille de style pour le <body id="">, ou directement en html <body bground="">, sauf erreur de ma part, mais il sera répété dans chaque zone du <frameset>. et pour les <div> il faut leur donner un fond transparent sinon ils masqueront ce fond général de la page.

Modifié par Beatnykk
Posté

Bonjour ksper92

et bienvenue sur le Hub :)

Tu peux sans problème attribuer une image de fond à un élément via ta feuille de style et lui attribuer différentes propriétés selon l'effet recherché.

Par exemple, avec ce style, le logo du Hub serait centré horizontalement et répété verticalement

body {
 background: url(hub.gif) repeat-y center;
}

Tout dépend de la nature de ton image, de sa taille...

Le mieux est bien sûr que tu nous donnes un exemple.

Guest ksper92
Posté

En fait, ce que je veux arriver à faire dans l'absolu serait par exemple une première couche (body avec background image) avec mon image de fond sur toute la zone.

Sur le body, viens s'ajouter un bandeau en haut, mes trois zones au milieu et mon bandeau de bas.

Ce que j'aimerais serait presque que je n'ai pas de couleur derrière mon texte et que lors des scrolling, l'image de fond reste fixée.

Mais là, j'avoue que je déprime :wacko:

Guest ksper92
Posté

Eureka !!! :idea:

J'ai compris mon erreur.

J'avais bien mis mon image dans la partie body de la page mais je remettais un fond dans tous mes div dans le corps et il ne fallait pas :evil:

Merci pour les infos

Posté

pour que le fond reste fixe lors d'un scroll, il me semble que le truc (valide sous ie seul) est d'ajouter dans le <body> l'attribut "bgproperties=fixed".

mais peut être ceci existe-t-il en css et compatible partout ?

Posté

Bonjour,

Pour une image de fond fixe, il convient d'utiliser ce style

body {
 background: url(hub.gif) fixed;
}

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...