Background-image passend maken

[jurrian-kaput]

Misschien is deze vraag al meerdere malen gesteld maar kon de vraag die ik heb niet precies terug vinden. In de bijlage in deze post zit backgroundimage die ik wil gaan gebruiken voor mij achtergrond van mij website. Nu heb je het probleem dat er mensen met verschillende resoluties werken. Ik wil graag dat mijn achtergrond passen is voor elke resolutie. Nu kun je een achtergrond maken van 1 pixel en deze laten herhalen.
Ik heb een achtergrond gemaakt met een gradient. Nu moet deze nog passend gemaakt worden. Zou iemand mij aan de hand van mijn bijlage op weg kunnen helpen.

Mvg,

Jurrian

 

[Goeroeboeroe]

Normaal genomen wordt een achtergrond-afbeelding herhaald, tot hij het element waar hij in staat helemaal vult. Naar opzij kan jouw afbeelding herhaald worden (met wat voorzichtigheid), naar onderen niet, want dan krijg je onder het groen weer geel.
Je kunt de afbeelding oprekken, maar dat is ingewikkeld en wordt bovendien waarschijnlijk foeilelijk. Browsers zijn geen gespecialiseerde grafische programma's en zijn niet erg goed in vergroten/verkleinen van afbeeldingen. Bovendien heb je 'n ruitjespatroon en dat wordt hoe dan ook vervormd als je gaat vergroten.

Oftewel: in de hoogte moet je de afbeelding dus zo hoog maken, dat hij het grootste scherm kan vullen. Nou ja, het grootste, met 1024 hoog dek je vrijwel alle schermen af. 'n Hoger scherm kun je dan gewoon 'n achtergrondkleur geven voor waar de afbeelding niet past.

Naar opzij kun je de afbeelding zich gewoon laten herhalen tot de body is gevuld. De afbeelding hoeft daarbij niet breder te zijn dan 1 ruitje, omdat hij wordt herhaald tot de body is gevuld. Als je netjes werkt, sluiten de ruitjes precies op elkaar aan. De ronde hoeken vallen wel weg, die kun je niet herhalen.
Als je de body even breed maakt als het scherm, vult je afbeelding de volle breedte.