css image 100% qui ne se répète pas.Résolu/Fermé

Question

Bonjour, 
j'aimerais savoir comment étiré une image a 100% (qui ne se répète pas) et qui ne bouge pas. Tout ça en css si possible (c'est une image inséré dans le css).

Merci de votre aide parce que là je ne trouve pas!


@+



Configuration: Windows 7 / Safari 534.16

varfendell · Answer

Bonjour,

Tu devrait essayer un truc comme ça:

body
{
   width: 100%;
   margin: 100%;
   margin-top: 20px;
   margin-bottom: 20px;    
   background-image: url("mon image");
   background-repeat: no-repeat;

}
 

Sinon jette un coup d'oeil ici

Légumeur · Answer

Voici mon code :

body
{
   width: 760px;
   margin: auto;
   margin-top: 20px;
   margin-bottom: 20px;    
   
}

/* L'en-tête */

#en_tete
{
   width: 760px;
   height: 100px;
   background-image: url("images/banniere.png");
   background-repeat: no-repeat;
   margin-bottom: 10px;
}

/* Le menu */

#menu
{
   float:left;
   width: 120px;
}

.element_menu
{
   background-color: red;
   background-image: url("images/motif.png");
   background-repeat: repeat-x;
   
   border: 2px solid black;
   
   margin-bottom: 20px;
}


/* Quelques effets sur les menus */


.element_menu h3
{    
   color: blue;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}

.element_menu ul
{
   list-style-image: url("images/puce.png");
   padding: 0px;
   padding-left: 20px;
   margin: 0px;
   margin-bottom: 5px;
}

.element_menu a
{
   color: green;
}

.element_menu a:hover
{
   background-color: orange;
   color: black;
}


/* Le corps de la page */

#corps
{
   margin-left: 140px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   
   color: #B3B3B3;
   background-color: red; /* Une couleur de fond pour le corps */
   background-image: url("images/motif.jpg");
   width : 100%;
   height: 100%;

   border: 2px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
   padding: 5px;
   clear: both;

   text-align: center;

   color: #B3B3B3;
   background-color: #626262;
   background-image: url("images/motif.png");
   background-repeat: repeat-x;
   
   border: 2px solid black;
} 


celui que tu m'a donné ne fonctionne pas. Je vais jeté un coup d'oeil au site du zero de ton lien.

Mecri!

Légumeur · Answer

C'est bon merci!

@+

Css image 100% qui ne se répète pas.

3 réponses

Discussions similaires

Newsletters