18106 sujets

Questions générales et questions de débutants

Dans formulaire une image de fond

Une feuille de style CSS lié au document avec un simple :


a écrit :

#monfond {

width: 111px;
background: url (tonimage.gif) repeat-y;
margin-left: auto; margin-right: auto;

}


biensur le nom que j'ai donné est a remplacer sur ton formulaire (ou) juste le nommer que tu veux. tout comme le width a 111px qui est biensur a mettre a la largeur de ton div (et de ton image). C'est bon si tu veux que l'image se repete sur la vertical. Sinon a la place de

a écrit :
background: url (tonimage.gif) repeat-y;


tu mettra

a écrit :
background: url (tonimage.gif) no-repeat;


comme ceci ton image ne sera qu'une fois presenté.

J'espere que ca t'aidera.
Modifié par Ankart (05 Dec 2006 - 01:20)
ben non cela ne marche pas où alors je me trompe dans mon code tu peux regarder merci dans mon code ??? Smiley bawling 

<style type="text/css">
/*Un style universel*/
* {margin: 0;padding: 0;}

/*Mon corps*/
body {
font-family: Century Gothic
font-size: 0.8em;
	margin: 0;
	padding: 0;
	background-color: #CCCCFF;
}

/*Ma tête*/
#header {
height: 100px;
background-color: #999999;
text-align : center
color :#0000CC
font-size : bold
margin-right: 0px;
}

/*Mon contenu*/
#conteneur {
position: relative;
width: 870px;
margin: 0 auto; 
background-color:#CCCCFF;
}

#centre {
background-color:#9999CC;
margin-left: 150px;
margin-right: 0px;}

#carte{
background: url (images/cartegrise007.jpg) no-repeat;}

/*Mon formulaire*/
input, textarea
{font-family: "Century Gothic"; /* On modifie la police du texte tapé l'intérieur des champs */}

input:focus, textarea:focus /* Quand le curseur est sur un champ (ne marche pas sur IE) */
{background-color: #FFFF99;}

label{color: blue; /* Colorer en bleu tous les labels */}

legend /* On met un peu plus en valeur les titres des rubriques*/{font-family: Century Gothic;font-weight: bold;}
   
fieldset
{margin-bottom: 15px; /* Une marge pour séparer les Titres des rubriques */background-color: #FFFFCC}   
#gauche {
position: absolute;
left:0;
width: 150px;
}

/*Mon pied de page*/
#pied {
height: 30px;
background-color:#0033FF;
font-family: Century Gothic
text-align : center
width: 860px;

}
/* Les menus*/
.menugauche {
list-style-type: none;
margin: 0;
padding:0;}

.menugauche li {margin-bottom: 5px;}

.menugauche a {
margin: 0 2px;
color: #0000CC
text-decoration: underline;
font-weight : bold
font-family: Century Gothic}

.menugauche a:hover {text-decoration: none;}
p {margin: 0 0 10px 0;}

/*Les Styles*/
.Style1 {font-family: "Century Gothic";font-weight: bold;color: #0000CC;}
.Style4 {font-family: "Century Gothic"; font-weight: bold; font-size: 9px; color: #0000CC;}
.Style6 {
font-family: "Century Gothic";
font-weight: bold;
color: #CCCCCC;
font-size: 10px;
}
/*Les liens*/
a:link {text-decoration: none;color: #0000CC;}
a:visited {text-decoration: none;color: #0000CC;}
a:hover {text-decoration: none;color: #0000CC;}
a:active {text-decoration: none;color: #FFFF00;}
</style>
</head>

<body>
<div id="carte">      
<fieldset>
<legend class="Style1">Références</legend> 

<!-- Titre de la catégorie -->

<label>Carte grise<br />
           <input type="text" name="N°carte grise" tabindex="50" />
    </label><br />
       <label>Chassis<br />
           <input type="text" name="chassis" tabindex="60" />
       </label><br />
       <label>Série<br />
           <input type="text" name="serie" tabindex="70" />
       </label>    
   </fieldset>
         
  </div>
ben si j'ai un dossier images de créé dans lequel les images sont stockées ! alors je fais comment ?
I'm sorry mais quand tu fais http://asm.alyzes.com/images/ ya pas d'images...
Je dit ça parceque c'est la seule explication possible, quand tu fais:
background-image: url(images.jpg), ça vat chercher ton images et ça la met en fond, point. ça marche à tout les coups, donc si ça marche pas c'est que soit ta sintaxe est mauvaise, soit il n'y a pas d'image.
Salut
Essaye d'enlever l'espace entre "url" et les parenthèse.
Remplace :
background: url (images/cartegrise007.jpg) no-repeat;

par:
background: url(images/cartegrise007.jpg) no-repeat;
Une ligne css comme
background: #fff url(images.gif) no-repeat top left;
est en fait une abréviation de:
background-color: #fff;
background-image:url(images.gif);
background-repeat:no-repeat;
background-position:top left;
seulement dans l'abréviation il faut faire atention avec les espaces, par exemple:
background: #fff url(images.gif)no-repeat top left;
ne marchera pas sous IE
Voilà je pense que tu devrais t'en sortir avec ça, par contre ce que je viens de t'expliquer est une information basique que tu trouves en 2 click sur google
"propriété background css" par exemple ou un truc dans ce gout là...
Je te dis ça juste pour les prochaines fois, autant il y des infos sur la conception web difficile a trouver autant les propriétés css c'est plutot simple.
merci cela marche je ne pensais pas qu'en tapant cela sur google on pouvait trouver maintenant je vais essayer de déplacer mes blocs type série pour qu'ils soient à la bonne place ? encore Smiley ravi
Hello,
matmat a écrit :
Une ligne css comme
background: #fff url(images.gif) no-repeat top left;
est en fait une abréviation de:
background-color: #fff;
background-image:url(images.gif);
background-repeat:no-repeat;
background-position:top left;
Pas vraiment, en fait, puisque les valeurs non précisées de background sont initialisées à leurs valeurs par défaut. Par exemple :
body {background: red; background: url(img.jpg) no-repeat;}
n'est pas équivalent à
body {background: red url(img.jpg) no-repeat;}
Sujet clos
Aller à