Archief - CSS: Back ground probleempje

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
M

Marcooo

Legacy Member
Ik heb dus een achtergrond voor een site die van de ene kleur naar de andere vloeit zoals op: http://www.wdwinfo.com/

Maar als ik deze dus inbreng in de body dan herhaalt hij zich na de ware grote. Dus dan begint de kleur opnieuw. Maar dat is zeker de bedoeling niet. Iemand enig idee hoe ik dit kan verhelpen?

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>Untitled Document</title>
		
	<style type="text/css">
	
body
{
	background: url(images/bg.png) fixed top;
}
	
	</style>
		
		
	</head>
	<body>
	</body>
</html>

Dank u
S

Smokyke

Legacy Member
Ik wil je graag helpen maar begrijp totaal niet wat je bedoelt :s
B

BloodSeaker

Legacy Member
Vrij simpel

body
{
background: #kleurcode-van-de-onderkant-van-je-gradient url(images/bg.png) repeat-x left top;
}

Als je de kleurcode van de onderkant van je gradient als background color zet, dan heb je de gradient zoals je hem wilt vermoed ik

Je image 'stretchen' zal sowieso niet gaan
B

Bram

Legacy Member
exxhal zei:
background-repeat: no-repeat;

of je zet dit erbij.
Klik om te vergroten...

no-repeat, a gij zijt gij goe gij :p en wa gaat er gebeuren als z'n background image maar 1px breed is?
e

exxhal

Legacy Member
BODY
{font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;font-style: normal;margin: 0px;
background: url(http://www.wdwinfo.com/images/bg-grad.jpg) fixed top;}
/* background: url(http://www.wdwinfo.com/holidays/images/flake.gif) ;} */

td, input{font-size: 13px;font-style: normal; }

a {color: #254C8E;}
a:hover {color: #3399FF;text-decoration: underline;}

h1, h2, h3, h4, h5 {font-size: 13pt;font-style: normal;font-weight: bold;}

/* CUSTOM BULLETS*/
.bulletforums { list-style: url(/images/forums-icon.gif); }
.bulletphoto {list-style: url(/images/camera-icon.gif);}
.bulletvideo {list-style: url(/images/video-icon.gif);}
.bulletplay {list-style: url(/disney-podcast/images/icon-sm.gif);}
.bulletholly {list-style: url(/holidays/images/Holly_10.gif);}
.bulletmail {list-style: url(http://www.wdwinfo.com/images/icon-mail.gif ); }
.bulletdigg {list-style: url(http://www.wdwinfo.com/images/icon-digg.gif ); }
.bulletfeed {list-style: url(http://www.wdwinfo.com/rss/images/feed-12b.gif ); }



.nobo{font-weight:normal;}

.out-tbl {border-left:1px solid #254C8E;border-right:1px solid #254C8E; background-color:#FFFFFF}
X

Xcessive-

Legacy Member
Afbeelding stretchen is niet mogelijk met css.
Je hebt 2 keuzes:
- Je herhaalt de afbeelding niet verticaal:
background: #xxxxxx url(images/bg.png) top repeat-x; (#xxxxxx vervangen door de onderste kleur van de gradient)

- Je herhaalt de afbeelding gewoon:
background: url(images/bg.png);

EDIT:
Je hebt natuurlijk nog de fixed methode maar dan moet je de image al hoog genoeg maken voor mensen met grotere resoluties.
background: url(images/bg.png) fixed no-repeat;
X

Xavez

Legacy Member
exxhal zei:
BODY
{font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;font-style: normal;margin: 0px;
background: url(http://www.wdwinfo.com/images/bg-grad.jpg) fixed top;}
/* background: url(http://www.wdwinfo.com/holidays/images/flake.gif) ;} */

td, input{font-size: 13px;font-style: normal; }

a {color: #254C8E;}
a:hover {color: #3399FF;text-decoration: underline;}

h1, h2, h3, h4, h5 {font-size: 13pt;font-style: normal;font-weight: bold;}

/* CUSTOM BULLETS*/
.bulletforums { list-style: url(/images/forums-icon.gif); }
.bulletphoto {list-style: url(/images/camera-icon.gif);}
.bulletvideo {list-style: url(/images/video-icon.gif);}
.bulletplay {list-style: url(/disney-podcast/images/icon-sm.gif);}
.bulletholly {list-style: url(/holidays/images/Holly_10.gif);}
.bulletmail {list-style: url(http://www.wdwinfo.com/images/icon-mail.gif ); }
.bulletdigg {list-style: url(http://www.wdwinfo.com/images/icon-digg.gif ); }
.bulletfeed {list-style: url(http://www.wdwinfo.com/rss/images/feed-12b.gif ); }



.nobo{font-weight:normal;}

.out-tbl {border-left:1px solid #254C8E;border-right:1px solid #254C8E; background-color:#FFFFFF}
Klik om te vergroten...
:wtf:
B

BloodSeaker

Legacy Member
Xavez zei:
:wtf:
Klik om te vergroten...

²


En ik vraag me soms af of sommige mensen de thread lezen of gewoon berichten posten om iets te zeggen :D want kdenk da het antwoord al 4 keer gegeven is of zo, ma de TS die ligt nog te slapen vermoed ik :D
e

exxhal

Legacy Member
Xavez zei:
:wtf:
Klik om te vergroten...

Dit is de CSS van de body van de site waar hij naar verwees.
Hij kan er mooi uithalen wat hij nodig heeft.:lol:
Dus denk niet dat het zomaar iets posten is.
Uit dat stukje kan ik en Marhino misschien nog iets leren.
R

Robijntje007

Legacy Member
Een afbeelding maken die ongeveer zo groot is als de max breedte...
En 1pixel hoog. Herhaal da ma gwn en da lukt normaal ook nog!
K

KoenDK

Legacy Member
Robijntje007 zei:
Een afbeelding maken die ongeveer zo groot is als de max breedte...
En 1pixel hoog. Herhaal da ma gwn en da lukt normaal ook nog!
Klik om te vergroten...

is het niet omgekeerd? een afbeelding die 1px breed is, en 1200px (voor de hoogste resolutie 1600*1200) hoog? gewoon in photoshop maken?
d

dJeez

Legacy Member
KoenDK zei:
is het niet omgekeerd? een afbeelding die 1px breed is, en 1200px (voor de hoogste resolutie 1600*1200) hoog? gewoon in photoshop maken?
Klik om te vergroten...
Dat hangt van de richting van de gradient af uiteraard :p. Maar in het aangehaalde voorbeeld (de Disney World site) wordt het idd wel zo gedaan (maar dan 2px bij 1200px).
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan