salut voila mon probléme sur mon site je veut métre un fond(image)mais sur mon site il n´aparait pas
body
{
margin: 10px 0;
padding: 0;
text-align: center;
font: 0.8em "Trebuchet MS", helvetica, sans-serif;
background-image: url("desing/images/fond.jpg");
}
merci
A mon avis, tu as fait une erreur avec le lien vers l´image... (je suppose que c´est plutôt design/images/fond.jpg
non design je lais écrit desing c´est pas sa
background-image: url(desing/images/fond.jpg);
deepblue sa marche toujour pas
tu as mis le chemin apr rapport a ta page html ou css ?
Précise les attributs width et height ![]()
deepblue oui car tout marche sauf le fond
oui quoi, par raport a la page html ou a la page css ?
as-tu précisé la largeur et la hauteur de l´image comme je te l´ai conseillé ![]()
non
sa marche pas
commen faire un fond fixe
pour une grande image :
background: url(monimage.png) no-repeat fixed;
pour une petite image en mosaïque :
background: url(monimage.png) repeat fixed;
sans oublier de préciser les attributs de largeur (width) hauteur (height) de l´image.
un conseil, va faire un tour sur
http://www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html tu y apprendra tout ça et bien d´autre choses ![]()
non sa marche toujour pas je vous donne tout mon code
body
{
margin: 10px 0;
padding: 0;
text-align: center;
font: 0.8em "Trebuchet MS", helvetica, sans-serif;
background: url(desing/images/fond.jpg) no-repeat fixed;
}
div#en_tete
{
width: 770px;
margin: 0 auto;
text-align: left;
border: 2px solid #4343BA;
background: #fff;
}
h1#header
{
height: 258px;
background: url("images/banniere.jpg") no-repeat left top;
margin: 0;
}
h1#header a
{
width: 400px;
height: 70px;
display: block;
background: url(images/title.gif) no-repeat;
position: relative;
left: 350px;
top: 15px;
}/* On donne les mêmes dimensions au lien, chose possible grâce à la propriété display: block; qui transforme le lien en élément de type block, auquel on peut donner des propriétés de taille. On met aussi l´image de fond qui a les mêmes dimensions que le cadre ainsi créé */
h1#header a span
{
display: none;
}/* Le span entourant le texte est fait pour pouvoir ne supprimer que le texte, ce que nous voulons, il suffit donc de donner à la propriété display la valeur none pour ne pas afficher le texte */
ul#menu
{
height: 35px;
margin: 0;
padding: 0;
background: url(images/motif-menu.gif) repeat-x 0 -25px;
list-style-type: none;
}
/* On donne une hauteur au menu, correspondant a la taille de l´image utilisée en fond, on met ensuite l´image de fond avec un décalage de 25 pixels vers le haut pour utiliser la technique de roll over expliquée dans un autre tutoriel */
ul#menu li
{
float: left;
text-align: center;
}/* On rend les li en flottant pour pouvoir les afficher horizontalement, on cache les puces, et on centre le texte */
ul#menu li a
{
width: 130px;
line-height: 25px;
font-size: 1.2em;
font-weight: bold;
letter-spacing: 2px;
color: #fff;
display: block;
text-decoration: none;
border-right: 2px solid #A8A8ED;
}/* C´est sur les liens que le gros du travail est effectué, largeur, hauteur de ligne, taille de police, graisse de police, espacement des lettres, couleur, bordure et decoration du texte. Nous pouvons dimensionner les a grâce à la propriété display: block; */
ul#menu li a:hover
{
background: url(bg_menu.gif) repeat-x 0 0;
}/* Et pour finir on décale l´image de fond au passage de la souris pour laisser aparaître l´état survolé de l´image, voir le tutoriel sur les roll over pour plus de détails */
div#corps
{
padding: 0 25px 0 100px;
background: url(bg_page.gif) no-repeat 15px 15px;
}
div#corps h2
{
padding-left: 25px;
line-height: 25px;
font-size: 1.4em;
color: #4343BA;
border-bottom: 1px solid #4343BA;
}
div#corps h3
{
margin-left: 15px;
padding-left: 5px;
border-bottom: 1px solid #4343BA;
border-left: 3px solid #4343BA;
color: #4343BA;
}
div#corps p
{
text-align: justify;
text-indent: 2em;
line-height: 1.7em;
}
div#corps a
{
color: #0000AB;
}
div#corps a:hover
{
color: #4343BA;
}
p#pied_de_page
{
margin: 0;
padding-right: 10px;
line-height: 30px;
text-align: right;
color: #0000AB;
}
pre
{
overflow: auto;
background: #A8A8ED;
border: 2px solid #9b2;
padding: 5px 0 0 5px;
font-size: 1.2em;
}
{
width: 636px;
}
pre span
{
color: #560;
}
pre span.comment
{
color: #0000B3;
}
ul {
list-style-type:none
}
a img {
border : none;
background-color: #4343BA;
}
a {
color : blue;
}
Apprends à lire !
Je t´ai dis de spécifier la largeur et la hauteur de l´image de fond !
body
{
margin: 10px 0;
padding: 0;
text-align: center;
font: 0.8em "Trebuchet MS", helvetica, sans-serif;
width: jenesaispascombiendepixels;
height: jenesaispascombiendepixels;
background: url(desing/images/fond.jpg) no-repeat fixed;
}
h1#header
{
width: jenesaispascombiendepixels;
height: 258px;
background: url("images/banniere.jpg") no-repeat left top;
margin: 0;
}
ul#menu
{
height: 35px;
margin: 0;
padding: 0;
width: jenesaispascombiendepixels;
background: url(images/motif-menu.gif) repeat-x 0 -25px;
list-style-type: none;
}
ul#menu li a:hover
{
width: jenesaispascombiendepixels;
height: jenesaispascombiendepixels;
background: url(bg_menu.gif) repeat-x 0 0;
}
div#corps
{
padding: 0 25px 0 100px;
width: jenesaispascombiendepixels;
height: jenesaispascombiendepixels;
background: url(bg_page.gif) no-repeat 15px 15px;
}
je tais répondu que sa marché pas ![]()
"sa marche pas"
help pliz
ça ne risque pas si tu ne le mets pas !
mets les, ça ne peux pas faire de mal, bien au contraire, car suivant les navigateurs, c´est OBLIGATOIRE !
tes liens sont bons ?
donne carrémment l´URL de ta page qu´on puisse regarder ce qui ne va pas !
peut-etre
background-image: url "(desing/images/fond.jpg)" ;