28173 sujets

CSS et mise en forme, CSS3

Superposer deux images background ds une page

hello je me casse la tete depuis 2 jours sur ce probleme:

j ai besoin de super poser deux images background dans un fichier sommaire.html

la 1ere (image1) est une image qui est centrée
la deuxieme (image2) est une image qui serat en mosaique derriere la 1ere.

pour la premiere image, elle s affiche sans probleme avce le code suivant inséré avant la balise <HEAD> dans sommaire.html :


<style><!--
#entete {
background: url("IMG/image1.jpg") no-repeat 0% 0%;
}
-->
</style>


le #entete faisant appel a ceci stocké dans habillage.css (auquel la page sommaire fait appel): 

#entete { 
	display: none;
	width:100%;
	height: 295px;
	display : block;


pour la seconde image

j'ai inséré dans le fichier sommaire html, avant le code css definissant image1, ce code css:


<style>
body {
background-color: #666;
background-image:url('IMG/image2.jpg');
background-attachment:fixed;
}
</style>


mais ça ne fonctionne pas, une seule image de fond s affiche

bref ça peut paraitre tout bete mais j arrive pas :s
amuart a écrit :
ça peut paraitre tout bete

… et ça l'est! Smiley ravi
Tu as appliqué le code suivant à ton entete:
display: none;
Du coup, ton entete est totalement invisible. Une raison d'être particulière de cette propriété ou simple distraction?
yep c'est parce que le fichier habillage.css est lié au squelette de spip que j utilise, et donc j avais remplacé le fichier image ss modifier le code

bref j ai enlevé dans habillage.css le: display:none

et dans mon sommaire.html j ai donc:

<style>
body {
background-image:url('IMG/image2.jpg');
background-attachment:fixed;
}
</style>
<style><!--
#entete {
background: url("IMG/jpg_une.jpg") no-repeat 0% 0%;
}
-->
</style>
</head>

mais le probleme persiste: au lieu d avoir mon image2 en mosaique, et par dessus mon image1 centrée, j ai juste mon image1 qui s'affiche centrée ..
Sujet clos
Aller à