Vlastnost background-attachment

Vlastnost background-attachment určuje, jak scrollovat obrázek na pozadí elementu: spolu s textem nebo zda bude text klouzat po obrázku.

Syntaxe

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

Hodnoty

Hodnota	Popis
`fixed`	Obrázek na pozadí bude nehybný a text po něm bude klouzat.
`scroll`	Obrázek na pozadí bude scrollovat spolu s textem.
`local`	Pozadí je fixováno s ohledem na chování elementu. Pokud má element scrollování, pozadí bude scrollovat spolu s obsahem, ale pozadí přesahující rámec elementu zůstane na místě.

Výchozí hodnota: scroll.

Příklad . Hodnota scroll

Nyní je vlastnost background-attachment nastavena na hodnotu scroll. Scrollujte elementem svisle - uvidíte, jak text scrolluje spolu s pozadím:

<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;
}

Příklad . Hodnota fixed

A nyní je vlastnost background-attachment nastavena na hodnotu fixed. Scrollujte elementem svisle - uvidíte, jak text klouzá po pozadí:

<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;
}

Viz také

vlastnost background,
která představuje zkratkovou vlastnost pro pozadí