2011-10-06 2 views
0

Est-il possible d'empiler une couleur par-dessus une autre couleur dans l'arrière-plan du corps pour correspondre au contenu d'un conteneur? Par exemple, si je sais que mon en-tête mesure 300 pixels de haut et qu'il est rouge, l'arrière-plan est rouge pour les 300 premiers pixels, puis l'arrière-plan doit correspondre à la couleur du reste de la page.Couleur d'arrière-plan du corps basée sur les pixels

Répondre

2

@ jw60660; vous le faites avec background-image poperty mais pas avec background-color mais vous pouvez faire comme ceci:

body{ 
    background:green; 
    margin:0; 
    padding:0 
} 
body:after{ 
    background:yellow; 
    content:""; 
    height:300px; 
    position:absolute; 
    top:0; 
    left:0; 
    right:0; 
    display:block; 
} 

Cocher cette http://jsfiddle.net/sandeep/TrZ9u/1/

+0

@ jw60660 Je voudrais simplement souligner que comme il est ... cela ne ne fonctionne pas dans IE7 et ci-dessous. – Joonas

+0

il y a une faute de frappe dans css "psotion" –

0

Ceci est également possible en enveloppant l'en-tête dans un conteneur de largeur 100% avec une couleur d'arrière-plan

body { background: green; margin: 0; padding: 0; } 
.header { width: 100%; height: 300px; background: yellow; } 

Exemple: http://jsfiddle.net/5KxJS/3/

Questions connexes