Egenskapen background-attachment

Egenskapen background-attachment anger hur bakgrundsbilden för ett element ska rullas: tillsammans med texten eller om texten ska glida över bilden.

Syntax

selektor {
	background-attachment: fixed | scroll | local;
}

Värden

Värde	Beskrivning
`fixed`	Bakgrundsbilden kommer att vara orörlig, och texten kommer att glida över den.
`scroll`	Bakgrundsbilden kommer att rullas tillsammans med texten.
`local`	Bakgrunden fixeras med hänsyn till elementets beteende. Om elementet har en rullningslist, kommer bakgrunden att rullas tillsammans med innehållet, men bakgrunden som går utanför elementets ramar förblir på plats.

Standardvärde: scroll.

Exempel . Värdet scroll

Nu är egenskapen background-attachment satt till värdet scroll. Rulla elementet vertikalt - du kommer att se hur texten rullas tillsammans med bakgrunden:

<body>
	<div id="elem">
		some long text
	</div>
</body>

body {
	background-attachment: scroll;
	background-image: url("bg.png");
}

#elem {
	width: 400px;
	margin: 0 auto;
	text-align: justify;
	font-weight: bold;
	font-size: 20px;
}

Exempel . Värdet fixed

Och nu är egenskapen background-attachment satt till värdet fixed. Rulla elementet vertikalt - du kommer att se hur texten glider över bakgrunden:

<body>
	<div id="elem">
		some long text
	</div>
</body>

body {
	background-attachment: fixed;
	background-image: url("bg.png");
}

#elem {
	width: 400px;
	margin: 0 auto;
	text-align: justify;
	font-weight: bold;
	font-size: 20px;
}

Se även

egenskapen background,
som är en genvägsegenskap för bakgrunden