Partage
  • Partager sur Facebook
  • Partager sur Twitter

Image de fond

    10 septembre 2006 à 14:07:33

    Bonjour, je voudrais metre une image de fond sur mon site mais je ne c'est pas comment fair voici mon code css
    body
    {
       background-color: #0099ff;
       margin-top: 20px;
       margin-bottom: 20px;
    }
    #en_tete
    {

       width: 760px;
       height: 200px;
       background-image: url("images/banniere.jpg");
       background-repeat: no-repeat;
       margin-bottom: 10px;
       margin-left: 70px;
       margin: auto;
    }
    #menu
    {

       float: left;
       width: 170px; /* Très important : donner une taille au menu */
       border-collapse: collapse;
    }

    .element_menu
    {
       background-color: #ffcc00;
       background-repeat: repeat-x;
       
       border: 2px solid black;
       
       color: red;   
    }   

    .element_menu h3 /* Tous les titres de menus */
    {   
       color: #ff0000;
       font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
       text-align: center;
    }

    .element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
    {
       padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
       padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
       margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
       color: red;
    }

    .element_menu a /* Tous les liens se trouvant dans un menu */
    {
       color: #ff0000;
    }

    .element_menu a:hover /* Quand on pointe sur un lien du menu */
    {
       background-color:#ff0000;
       color: black;
    } 
    #corps
    {

       margin-top: 10px;
       margin-left: 150px;
       margin-bottom: 20px;
       padding: 5px;
       
       background-color: #ffcc00;
       background-repeat: repeat-x;
       
       border: 2px solid black;
       
       color: #000000;
    }
    .presentation
    {
       color: red;
       text-align: center;
       text-decoration: blink;
       text-transform: uppercase;
    }
    .pub
    {
       color: #e7074f;
       font-weight: bolder
    }
    #pied_de_page
    {

       padding: 5px;

       text-align: center;

       color: #ff3300;
       background-color: #ffcc00;
       background-image: url("images/motif.gif");
       background-repeat: repeat-x;
       
       border: 2px solid black;
       margin-left: 150px;
       
       color: #ff3300;
    }
    h1
    {
        color: #ff3300;
            text-align: center;
            text-decoration: underline;
    }
    a
    {
       color: #ff3300;
    }
    table
    {
       border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
    }
    td
    {
       color: #000000;
       border: 1px solid black;
       text-align: center;
       padding: 5px;
    }
    caption
    {
       color: red;
       font-size: x-large;
       font-weightbold;
       text-decoration: underline;
    }
    th
    {
       color: #3399ff;
       border: 1px solid black;
    } 
    #membres
    {

       margin-top: 10px;
       margin-bottom: 20px;
       padding: 5px;
       
       background-color: #bbfed8;
       background-image: url("images/motif.gif");
       background-repeat: repeat-x;
       
       border: 2px solid black;
       
       color: #000000;
    }
    .tchat
    {
       border: 2px solid black;
       text-align: center;
       padding-bottom: 5px;
       padding-top: 5px;
    }
    .reglement
    {
      text-align: left;
      color: #ffffff;
    } 
    #imagesinscription
    {

       background-color: #04169e;
       background-repeat: repeat-x;
       float:right,top;
       border: 2px solid black;
    }
    h2
    {
        text-decoration: underline;
        color: #ff3300;
    }
    h3
    {   
        color: #ff3300;
    }
    img
    {
        border: none;
    • Partager sur Facebook
    • Partager sur Twitter
      10 septembre 2006 à 14:16:42

      Salut

      Pour mettre une image de fond, tu fais un background-image sur la balise body ;)

      au fait, pour un background-color, pas besoin de repeat. Les repeat ne servent qu'aux images.

      Et une dernière chose, utilise le fait que le background est une méga-propriété. Au lieu d'écrire background-color, background-image, background-repeat, tu peux tout à fait écrire : background:url("chemin.ext") couleur no-repeat;
      //le no-repeat s'applique uniquement à l'image
      • Partager sur Facebook
      • Partager sur Twitter
      Only limits are ours...

      Image de fond

      × 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