Rechercher : dans
Par :

Problème CSS background-image

Dernière réponse le 10 mar 2009 à 11:22:13 jiggy-j, le 10 mar 2009 à 10:51:23 
 Signaler ce message aux modérateurs

Bonjour,


Je suis en train de créer un site Web pour la premiere fois.

C'est un peu le bordel dans mon code mais je m'y retrouve a peu près. Et tout fonctionne pour le moment sauf un problème qui persiste et que je ne comprend absolument pas.


En fait quand je met un background-image avec l'url, il ne saffiche pas. J'ai une feuille CSS qui est appelé dans le html. celafonctionne puiske j'ai créer un menu déroulant dans le CSS et que je met des style au text, liens etc... mais c'est juste le background qui ne veux pas s'afficher et je trouve cela très bizard.

Je colle tout le code CSS ici au cas ou se soit un probleme plus bas mais j'ai beau cherché je ne comprend pas.



body{
	padding:0px;
	margin-top: 0px;
	background-color:#000
	background-image:url(fond.jpg);
	color:#9e9e9e;
	font: 10px/14px Arial, Myriad Pro, Verdana, sans-serif;
	width:809px;
	margin:auto;
	border:3px solid #E6E6E6;
}

a:link { 
	font-weight: bold ; color: #FFF ; 
}

a:visited{
		font-weight: bold ; color: #FFF ; 
}

a:hover {
 color: #970000 ; 
 }




#copyright{
	text-align:center;
	font-size:8px;
	background:#E6E6E6;
	margin:0;
}

.italic{
	font-style:italic;
	text-align:center;
}

.h1{
	font-size:20px;
	font-weight:bold;
}

.h2{
	font-size:17px;
	font-weight:bold;
}

#menu{
	width:900px;
	background:url(images/fond_menu.gif)
}

dl{
	height:18px;
	margin:0px; padding:0px;
	display:block;
	float:left;
}

dt{
	display:block;
	height:20px;
	line-height:20px;
	text-align:center;
	cursor:pointer;
}

dd{
	display:block;
	margin:0px; padding:0px;
	border-top:5px solid #000;
	border-bottom:5px solid #000;

}

dd ul{
	margin:0; padding:0;
	text-align:center;
	list-style:none;
	background:#000;
	font-family:arial;
	font-size: 9px;
	text-align:center;
}

dd ul li{
	display:block;
	margin:0; padding:0;
}

dd ul li a{
	display:block;
	color:#FFFFFF;
	text-decoration:none;
	width:114px;
	height:25px;
	line-height:25px;
	border-bottom:solid 1px #000;
	border-top:solid 1px #000;
	margin:0;padding:0;
}

dd ul li a:hover{
	color:#970000;
	background:url(images/fond_menu_over.gif);
}

dl dd{
	display:none;
}

dl:hover dd{
	display:block;
	
}

#conteneur-menu{
		background:url(images/fond_menu.gif);
		position:relative;
		margin:auto;
}
Configuration: Windows XP
Firefox 3.0.7

Meilleures réponses pour « Problème CSS background image » dans :
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
Enlever la bordure sur une image dans un lien en HTML/CSS VoirVous avez fait une image cliquable en mettant une balise IMG au sein d'un lien et le navigateur vous affiche un cadre ou plus exactement une bordure autour de l'image. Il existe deux façons de supprimer cette bordure...
Une popup d'information au survol sans Javascript ni CSS VoirParfois, il peut être utile d'afficher des informations supplémentaire au survol du curseur sur une zone de l'écran, par exemple "Cliquez pour agrandir" sur une image, un descriptif sur une abbréviation ou des détails sur un lien. On trouve...
Positionner des éléments grâce aux CSS VoirIl est possible grâce aux feuilles de style de positionner au pixel près du texte ou des images grâce aux balises et . Cela est possible avec les versions 4 de Netscape et d'Internet Explorer, cependant cette technique reste hasardeuse...
Les arrière-plans VoirInsérer une image en fond Il est possible de définir une image d'arrière-plan pour la page web grâce aux attributs de la balise  : Attribut Effet Visuel BACKGROUND="image" Affiche l'image en arrière...
CSS - Les couleurs VoirLes couleurs Le standard CSS propose différentes façons de définir des couleurs : par un nom avec la notation hexadécimale avec la notation décimale Appel d'une couleur par son nom Le langage HTML définit des noms pour un nombre limité de...

1

NookZ, le 10 mar 2009 à 10:57:49

Les images sont bien dans les bons répertoires?
Par exemple fond.jpg se trouve-t-il dans le même répertoire que le fichier CSS?

Répondre à NookZ

2

jiggy-j, le 10 mar 2009 à 11:05:34

Non le fichier css est dans un dossier qui s'appelle css mais il est appelé corectement dans la page html. le fichier fond.jpg est dans un dossier images.

Répondre à jiggy-j

3

NookZ, le 10 mar 2009 à 11:07:44

Oui seulement ce que vous envoyez dans le background-image c'est le chemin de l'image et l'image.

Par exemple si vous avez comme arborescence:

CSS
->fichier.css
IMAGES
->fichiers images dont fond.jpg

il faudra mettre
background-image:url(../IMAGES/fond.jpg);

Répondre à NookZ

4

jiggy-j, le 10 mar 2009 à 11:12:19

Ah oui dsl.

En fait a la base j'avais marqué background-image: url(images/fond.jpg);


En fait il fallait rajouter les 2 point avant /images. Sa marche nikel je vous remercie.

Est-ce que je pourrais juste savoir la signification des 2 points avant le nom du repertoire. Car je n'ai pas trop compri pourquoi ça ne marchai pas sans.

Merci beaucoup.

Répondre à jiggy-j

5

NookZ, le 10 mar 2009 à 11:17:14

Les .. signifie que l'on remonte au répertoire parent
et si vous mettez uniquement un ., cela signifie le répertoire courant

Répondre à NookZ

6

 jiggy-j, le 10 mar 2009 à 11:22:13

Ok merci beaucoup.

Sa fonctionne parfaitement.

Je ne suis pas inscrit comment puis-je mettre [résolu]?

Merci encore

Répondre à jiggy-j