Partage
  • Partager sur Facebook
  • Partager sur Twitter

Question Sur 'Background-image'

Sujet résolu
    2 décembre 2005 à 11:50:25

    Bonjour à tous, comme je n'ai pas trouvé ce que je cherchait sur le forum, je me suis permis d'en faire un. Voilà ma question: est-il possible de mettre plusieurs background-image dans un bloc. Par exemple pour une bordure, peut la mettre en haut, et en mettre une autre(differente) en bas ?
    • Partager sur Facebook
    • Partager sur Twitter
    Anonyme
      2 décembre 2005 à 12:18:26

      le mieux est de faire un bloc pour la bordure du bas et un bloc pour la bordure du haut, enfin, il me semble :o !
      • Partager sur Facebook
      • Partager sur Twitter
        2 décembre 2005 à 13:08:51

        Ué c'est une idée, quoique un peu longue malheuresement si on a beaucoup de bloc, merci :D. Une dernière question, je n'ai pas compris comment on arrive à mettre la bordure en bas ( exemple du cours -où le designe 'petit poney' :'|- on les bordures des blocs en bas) ?
        • Partager sur Facebook
        • Partager sur Twitter
        Anonyme
          2 décembre 2005 à 13:32:43

          C'est à dire ?

          Edit : tout simplement en mettant un div pour le bas du cadre juste avant de fermer le div du cadre, enfin, il me semble :o !
          • Partager sur Facebook
          • Partager sur Twitter
            2 décembre 2005 à 14:09:23

            Non, hélas, tu ne peux pas.
            Tu dois imbriquer 2 <div> (par exemple), en attendant le CSS 3.


            Bisous
            • Partager sur Facebook
            • Partager sur Twitter
              2 décembre 2005 à 15:56:11

              bonjour,
              pour mettre 2 images en background sans balises supplementaires il te suffit d'appliquer la premiere image a html, et l'autre a body.
              L'effet amusant, deconcertant , peut-etre, c'est que l'image en background peut se repeter sur toute la page, et celle de body, se superposeras, seulement sur la partie effectivement occupé par body (une paage a moitié remplie n'affichera le background de body que sur la moitié Cela peut-etre avantageux.

              A l'opposé, pour rendre les 2 images affichable , sur(sous) l'ensemble de la page, il faire en sorte par le biais du css, que body et html fassent toujours bien les 100% de hauteur de la page.
              ex: (en usant du principe d'une hauteur minimale de 100%).

              html,body {
              min-height:100%;
              height:auto!important;/* pour ne pas bloquer la hauteur a 100% de la fenetre */
              height:100%;/* Ie ne comprend pas min-height mais gere height de cette façon ! */
              }
              html {background-image:url(1ereimage.jpg);}
              body {background-image:url(2emeimage.jpg);}


              a partir de la a toi de gerer les positions des images et repetitions ou non.
              Si l'image html n'est pas repeter et que tu veux que l'image de body(repetée, il est cependant plus logique de faire l'opposé)) , ne deborde pas de la zone body(cas d'une largeur/hauteur de body inferieur a 100%), en appliquant une simple couleur de fond a html, effacera l'image en dehors de la zone body.
              N'oubli que si ton image body se repete et n'est pas "transparente", tu ne verras bien entendu pas l'image dessous.logique.

              En jouant avec les couleurs et images en fond sur ces 2 balises et en ajoutant des margin a body ou padding a html tu peut faire des effet de toutes sortes ..., cadre, marges, etc ...

              a plus
              • Partager sur Facebook
              • Partager sur Twitter

              fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

                2 décembre 2005 à 17:44:20

                Merci pour l'explication, sa aurait été parfait d'ailleurs, mais comme j'ai déjà posé une image dans l'Html, la nouvelle remplace l'ancienne. Cependant personne ne sait comment appliquer la bordure en bas du bloc ?

                ******************
                ------------------ <== Bordure en haut du bloc
                ------------------
                ------------------
                ------------------
                ------------------



                ------------------
                ------------------ <== Bordure en bas du bloc
                ------------------
                ------------------
                ------------------
                ------------------
                ******************
                • Partager sur Facebook
                • Partager sur Twitter
                  2 décembre 2005 à 21:38:26

                  ?? et avec le truc des 2 fond superpose avec body et html ou 2 div ou n'importe qu'elle autre couple de balise imbriqué t'arrive pas a t'en sortir ?
                  (l'idée du background dans html et body[idée proche du sujet] etait un plus au topic pour les curieux, aprés les bisous d'encouragement ;) , tu devais theoriquement etre en mesure de réglé ton souci)

                  pour rappel/info une image en fond positionnée au bas de la balise et repete horizontalement c'est background-position:bottom; et un background-repeat:repeat-y;
                  a plus et bon dev.

                  • Partager sur Facebook
                  • Partager sur Twitter

                  fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

                    3 décembre 2005 à 11:57:32

                    j'ai bien tout analysé...et j'ai enfin compris aprés des essais désastreux. Mais au moins sa marche.
                    Merci encore a ceux qui m'ont aider !
                    • Partager sur Facebook
                    • Partager sur Twitter

                    Question Sur 'Background-image'

                    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                    • Editeur
                    • Markdown