Html/css double backgroud

Bonjour,
savez vous comment faire un background en top et un en bottom comme sur ce site???
http://www.top-figurine.com/contact.php
merci

cordialement, rake-off.
Configuration: Windows XP
Firefox 3.0.10

26 réponses

Résumé de la discussion

Plusieurs réponses évoquent l'utilisation de z-index, de couches et de positions absolues pour superposer des images d'arrière-plan en haut et en bas dans un cadre CSS, afin d'obtenir un effet visuel équivalent à deux fonds. Certaines solutions considèrent qu'il est difficile, voire impossible, d'appliquer deux images distinctes comme background; d'autres suggèrent d'insérer des éléments et d'ajuster le footer via un z-index négatif. La discussion souligne aussi que l'effet peut dépendre de la taille de la fenêtre plutôt que du contenu, ce qui complique le placement et nécessite des ajustements responsive. En pratique, certains évoquent des combinaisons CSS, Ajax et jQuery pour obtenir un rendu proche sans conclure à une solution universelle, et précisent que les résultats dépendent du contexte.

Bobot (l’IA à votre service)
  1. je ne partage pas cet avis et le Cnam reste la réference .
    fais comme tu veux
    1. Je ne parle pas des forum et des parole mais d'un vrai enseignement suivis où j'ai clairement suivis un cours ou l'on ma dit les tableau ne serve pas à cela ce qu'il faut c'est utiliser des div .
      1. Méfies toi de ce qu'on dit, c'est enseigné ainsi par les prof du Cnam, les forum et la parlote ne prête pas à conséquence.
        1. Oui mais d'après ce que j'ai appris ce n'est pas une bonne méthode de ce servir d'un tableau pour cela
          1. qu'est ce que footer en faite??? et je voulais savoir si j'ai bien suivis tu te sert d'un tableau pour dispositionner tes bloc??
            1. tu peux aussi faire comme suit :

              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              <html xmlns="http://www.w3.org/1999/xhtml">
              <head>
              <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
              <title>Document sans nom</title>
              <style type="text/css">
              <!--
              .bg {
              background-image: url(http://michel-mee.com/
              background-repeat: repeat-x;
              background-color: #CCCCCC;
              margin: 0;
              }
              .container {
              margin-top:120px;
              height: 600px;
              }
              .txt {
              font-family: Arial, Helvetica, sans-serif;
              color: #993333;
              font-size: 24px;
              }
              .titr {
              font-family: Arial, Helvetica, sans-serif;
              color: #660099;
              font-size: 32px;
              }
              -->
              </style>
              </head>

              <body class="bg">
              <table class="container" width="1366" border="0" cellspacing="0" cellpadding="0" align="center">
              <tr>
              <td width="171"> </td>
              <td width="1024"><p align="center" class="titr">09/03/08<br /></p>
              <div align="justify"><span class="txt">Des images tournées avec un téléphone portable montrent le char en train de percuter un coin de la maison. Le conducteur, apparemment saoûl et hilare, tente maladroitement de se hisser à bord avec deux bouteilles de vodka.<br />
              "Sortez-le du char", hurle alors une villageoise.<br />
              L'armée a promis vendredi de verser des dédommagements aux propriétaires de la maison et a dit que le char devait avoir connu une panne et avoir été distancé par une colonne de blindés qui se dirigeait vers un site de manoeuvres.<br />
              Auparavant, l'armée avait expliqué que le blindé avait glissé sur de la neige fondue.<br />
              "Bien sûr, il y a eu des abus mais l'équipage a agi de toute bonne foi pour rattraper son unité", a déclaré le colonel Konstantin Lazoutkine, porte-parole du District militaire Volga-Oural.<br />
              "Dieu merci, ils n'ont pas tiré", dit quant à lui le propriétaire de la maison sur la vidéo.</span>
              </p>

              <p><span class="txt">BERLIN (AFP) - Quelque 230 DVD pornographiques ont été retrouvés à l'abbaye Maria Laach, l'une des plus célèbres d'Allemagne, dissimulés dans la chambre d'un moine bénédictin, affirme le quotidien bavarois Abendzeitung de jeudi.<br />
              La police a fait cette découverte après le vol de 4 DVD de pornographie homosexuelle par un moine dans un sex-shop de Wurtzbourg, en Bavière.<br />
              Le moine de 49 ans avait été pris en flagrant délit par la vendeuse. Il s'était alors échappé du magasin, avait jeté dans une poubelle municipale son larcin avant d'être rattrapé par la police, selon le journal.<br />
              Comme le sex-shop se plaignait de vols à répétition, des policiers se sont rendus dans l'abbaye du moine, en Rhénanie-Palatinat, et y ont découvert la collection de films dans sa cellule. </span></p></div></td>
              <td width="171"> </td>
              </tr>
              </table>
              <table width="1366" border="0" cellspacing="0" cellpadding="0" align="center" background="http://michel-mee.com/">
              <tr>
              <td align="center" height="100">FOOTER</td>
              </tr>
              </table>
              </body>
              </html>

              qu'en pense tu ?
              1. mon problème de double background, c'est que si ce n'est qu'un png sur toute la page comment cela ce fait que le fichier png prendrai la taille de la page traité sans jamais ce déformé, juste le centre en blanc s'allongerai?? mais comment?
                1. je veux pas etre de mauvaise fois, mais ... j'ai crée mon topic, avant de poser ma question ici mais .... sans reponse depuis hier !
                  1. ma question repose egalement sur les feuille de style CSS du forum-actif !

                    j'aimerais savoir, comment integrer un curseur personalisé sur son forum, j'ai vu plein de topic sur ce sujet, non seulement un topic sur les faq forum-actif, mais je ne comprend pas leur description :

                    body {
                    cursor: url('ADRESSE DU CURSEUR.cur'), auto;
                    }

                    que dois-je mettre a " ADRESSE DU CURSEUR.cur ??? je ne c'est pas comment heberger un curseur, si c'est ce qu'il faut faire !

                    et secondo, faut-til enlever les deux petit " ' " avant et apres l'adresse ?

                    merci pour vos reponses
                    1. Merci de te créer ton propre topic plus que de poser ta question sur celui d'un autre.
                      A chaque question son topic.
                  2. Si ce site t'inspire tellement, tu peux en afficher la source ...
                    Par contre, ... désolé de spoiler, mais il semblerait que leur double background CSS n'est qu'un simple PNG sur toute la page ;)
                    1. le probleme c ke mon background fai 1000px de haut et le pied de page y est coller au lieu d'être tt en bas
                      1. suprime : bottom: 1px; si tu veux que tout soit collé et suprime aussi le z-index (à voir)
                        1. je suis désolé mais la il ne s'affiche pas en bas de la page web mais au bas de la fenêtre donc il ce place par rapport à la taille de la fenêtre et n'est ppas au bonne endroit, une idée??

                          merci
                          1. fait un copier coller du code, j'ai fais une ou deux modif et remplace le span par div
                            1. oui mais du coup j'ai toujours mon problème mon span ne s'affiche pas en bas de la page??
                              1. merci beaucoup, cela marche mais j'ai toujours un soucis mon span ce trouve sous le corps (3eme dimension) mais juste en dessous de mon background et non en bas de ma page comme je le voudrais, un div ne serai pas plus favorable??
                                1. z-index c'est la position du "calque" ou div dans la 3eme dimension, c'est à dire en profondeur.
                                  pour les span :
                                  http://www.webmaster-hub.com/lofiversion/index.php/t3085.html
                                  1. Ajax Flash et Css…

                                    pour revenir a la class bottom, si tu veux que le footer passe dessous, met z-index à -(moins)100
                                    tu peux voir aussi mon autre site, Ajax et jQuery Css Flash :
                                    http://michel-mee.com/
                                    A+
                                    • 1
                                    • 2