Tom's Guide > Forum > Programmation > aide pour débutant en CSS
Mot :    Pseudo :           
 

bonjour j'aimerais savoir comment faire pour avec l'aide de ma feuille CSS pour mettre une image que j'ai divisé en trois?
Merci d'avance :hello:

Liens sponsorisés
Inscrivez-vous ou connectez-vous pour masquer ceci.

bonsoir
si je comprends bien, il faire des blocs

Répondre à ideal23

Salut,

L'image, c'est pour faire quoi ?

Répondre à CustMax

enfaite pour mon header ma sidebar et mon content, j'aimerais savoir comment grâce à la feuille de style CSS mettre une image en top et en bas et pour relier le tout une image qui vas se répéter. et j'aimerais donc savoir comment faire.


Message édité par ugotang le 16-11-2008 à 01:05:54
Répondre à ugotang

salut
mettre une image en top et en bas et pour relier le tout une image qui vas se répéter, j'avoue que je ne comprends pas bien.
su tu veux faire un design, tu peux le découper et mettre les images en background-image: url(../images/banniere.gif); dans tes boîtes.

Répondre à ideal23

Alors, tu dois créer des div qui sont des blocs et dans ceux-ci tu mettra le fond que tu veux.
Genre dans le HTML

Code :
  1. <div id="header"></div>
  2. <div id="content"></div>
  3. <div id="footer"></div>


Pour afficher un bloc pour le header, un bloc pour le contenu et un autre pour le footer.

Puis tu auras dans le CSS:

Code :
  1. #header {
  2. background-image: url(./images/header.jpg);
  3. background-repeat: no-repeat;
  4. min-height: 150px;
  5. }
  6. #content {
  7. background-image:url(./images/content.jpg);
  8. background-repeat: repeat-y;
  9. min-height: 300px;
  10. }
  11. #footer {
  12. background-image:url(./images/footer.jpg);
  13. background-repeat: no-repeat;
  14. min-height: 30px;
  15. }


Sachant que le fond (background) du contenu se répetera, mais aura une taille minimal de 300px.

Répondre à CustMax

CustMax a écrit :

Alors, tu dois créer des div qui sont des blocs et dans ceux-ci tu mettra le fond que tu veux.
Genre dans le HTML

Code :
  1. <div id="header"></div>
  2. <div id="content"></div>
  3. <div id="footer"></div>


Pour afficher un bloc pour le header, un bloc pour le contenu et un autre pour le footer.

Puis tu auras dans le CSS:

Code :
  1. #header {
  2. background-image: url(./images/header.jpg);
  3. background-repeat: no-repeat;
  4. min-height: 150px;
  5. }
  6. #content {
  7. background-image:url(./images/content.jpg);
  8. background-repeat: repeat-y;
  9. min-height: 300px;
  10. }
  11. #footer {
  12. background-image:url(./images/footer.jpg);
  13. background-repeat: no-repeat;
  14. min-height: 30px;
  15. }


Sachant que le fond (background) du contenu se répetera, mais aura une taille minimal de 300px.



Merci CustMax et pour mettre 3 images dans le header par exemple il faut créer un div par images?

Répondre à ugotang

Pour que les trois images soient alignées, la méthode la mieux, pour moi, serait de faire un <span> par image le tout englobé dans une div.

Code :
  1. <div id="header">
  2.   <span id="header_1"></span>
  3.   <span id="header_2"></span>
  4.   <span id="header_3"></span>
  5. </div>



Je ne suis pas sur que ça marche comme il faut, mais essaye.

et tu mettra dans ton CSS:

Code :
  1. #header {
  2. min-height: valeur_a_changer px;
  3. }
  4. #header_1 {
  5. background-image: url(./images/header1.jpg);
  6. background-repeat: no-repeat;
  7. margin: 0px;
  8. }
  9. #header_2 {
  10. background-image: url(./images/header2.jpg);
  11. background-repeat: no-repeat;
  12. margin: 0px;
  13. }
  14. #header_3 {
  15. background-image: url(./images/header3.jpg);
  16. background-repeat: no-repeat;
  17. margin: 0px;
  18. }



A toi de tenter ;)

Répondre à CustMax

Merci CustMax, mais ça ne fonctionne pas :s

Répondre à ugotang

Quelqu'un aurait d'autres solutions?
Merci D'avance

Répondre à ugotang

Tu pourrais nous montrer ce que tu as essayé ? (ton feuillet de style quoi)

Et qu'est-ce qui ne fonctionne pas exactement ? Les trois images dans le header ou les images sur l'ensemble du site ?

Répondre à Glu-glu
Tom's Guide > Forum > Programmation > aide pour débutant en CSS
Aller à :

Il y a 308 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler
Liens