Image d'arrière-plan du site Web - Comment?

J'ai une requête basée sur le code CSS et HTML suivant (voir ci-dessous)Image d'arrière-plan du site Web - Comment?

J'ai une image de fond qui couvre toute la page du navigateur (de gauche à droite), ce qui n'est pas ce que je cherche.

Comment puis-je obtenir l'image d'arrière-plan pour rester dans les limites de mon canevas de contenu principal, par exemple 850x600px et tout ce qui est à l'extérieur doit être blanc?

Merci.

body { 
background-color: #ffffff; 
margin:0px; 
padding:0px; 
background-image: url(images/background.jpg); 
background-repeat: repeat-x; 
background-attachment: scroll; 
} 

#main { 

width:850px; 
margin: 0px auto 0px auto; 
border: 0px solid #f0f0f0; 

} 

<body> 

<div id="main"> 
<img src="images/female_model.jpg" id="female_model" alt="" /> 
<div id="colwrap1"> 
<img src="images/nav_bar.jpg" id="nav_bar" alt="" /> 
<img src="images/site_name.jpg" id="site_name" alt="" /> 
</div> 
</div> 

</body>

Source

2010-02-07 tonyf

Que diriez-vous de simplement mettre l'image de fond sur votre #main?

Source

2010-02-07 13:06:00 Gareth

Si vous souhaitez joindre l'arrière-plan au DIV main, spécifiez l'arrière-plan. Il semble que vous souhaitiez que l'arrière-plan soit centré horizontalement (background-position: 50%;) mais répétez l'opération pour l'extension verticale du main DIV (background-repeat: repeat-y;).

body { 
    background-color: white; 
    margin: 0px; 
    padding: 0px; 
} 

#main { 
    background-image: url(images/background.jpg); 
    background-repeat: repeat-y; 
    background-position: 50%; 

    // rest as before ... 
    width: 850px; 
    ... 
} 

<div id="main"> 
    Lorem ipsum dolor sit amet, ...

Si votre image de fond ne semble pas qu'il pourrait être parce que l'image est inaccessible ou main DIV n'a pas la hauteur - qui pourrait se produire si female_model et colwrap1 les deux flotteurs.

Source

2010-02-07 13:07:05

Merci pour cela, mais malheureusement mon image d'arrière-plan n'apparaît plus. Pour info, mon fichier d'image de fond est une bande verticale qui a une dimension de 22x600. Toute aide supplémentaire serait appréciée. J'utilise Chrome ou FF sur Mac OS X. Merci. – tonyf

Ensuite, oubliez les antécédents de Domonic - ligne de répétition – Mark

Toujours pas fonctionné - je pensais vraiment que ce serait facile, mais cela m'a bloqué! – tonyf

Dominic a raison. Déplacez les propriétés d'arrière-plan du corps vers la div principale et vous devriez avoir ce dont vous avez besoin.

Si je comprends bien votre question, vous voulez définir l'arrière-plan de la page à blanc et ont l'arrière-plan de votre principal div être quelle que soit l'image que vous définissez à - correct?

Si oui, le corps à réglage:

body 
{ 
    background:#fff; 
}

devrait faire l'affaire. Maintenant, j'ai également remarqué que l'image que vous souhaitez utiliser a une largeur inférieure à celle de votre div. Vous voulez principal d'avoir les propriétés suivantes:

#main 
{ 
    background-image:url(myimage.jpg); 
    background-position:top; 
    background-repeat:repeat-x; <!-- you need this as your image is < than the div width --> 
}

Cela devrait faire l'affaire. Si cela ne fonctionne toujours pas, vous souhaitez peut-être partager le lien de la page sur votre serveur. Il est possible que nous ayons mal compris votre question.

Source

2010-02-07 13:13:11 noobzilla

pas aller malheureusement. – tonyf

Image d'arrière-plan du site Web - Comment?

Répondre

Questions connexes