Jak Zrobić Nieruchome Tło

Spisu treści:

Jak Zrobić Nieruchome Tło
Jak Zrobić Nieruchome Tło

Wideo: Jak Zrobić Nieruchome Tło

Wideo: Jak Zrobić Nieruchome Tło
Wideo: Jak zrobić przeźroczyste tło w obrazku 2024, Kwiecień
Anonim

Tło strony internetowej może być powiązane z jej treścią lub zachowywać się niezależnie od niej. W pierwszym przypadku podczas przewijania treści w oknie przeglądarki przewija się również obraz tła, natomiast w drugim może pozostać nieruchomy. Aby zaimplementować stałe tło strony, powinieneś użyć języka opisu stylu CSS - tylko on może zagwarantować takie samo zachowanie tła w różnych typach przeglądarek.

Jak zrobić nieruchome tło
Jak zrobić nieruchome tło

Instrukcje

Krok 1

Użyj właściwości background-attachment w CSS, aby określić, czy tło strony powinno być stałe, czy ruchome. W sumie ta właściwość może mieć trzy wartości - jeśli nie określisz żadnej z nich, to domyślnie załącznik w tle jest uważany za scroll. Przy tej wartości obraz tła przewija się wraz z zawartością strony. Wartość dziedziczenia kopiuje zachowanie tła elementu nadrzędnego, a wartość stała sprawia, że obraz tła jest niezależny od zawartości - pozostaje nieruchomy podczas przewijania strony. Powinieneś go użyć.

Krok 2

Przygotuj instrukcje CSS do użycia na stronach, na których chcesz naprawić tło. Jeśli nie umieścisz kodu CSS w zewnętrznym pliku opisu stylu, instrukcje te należy umieścić pomiędzy otwierającym i zamykającym znacznikiem stylu:

// będą opisy stylów

Opis zachowania tła strony musi być powiązany z elementem BODY - w terminologii CSS będzie to nazywane "selektorem" i będzie napisane tak: BODY {

// tutaj będą opisy treści strony

} Właściwości związane z tym selektorem muszą być umieszczone w nawiasach klamrowych, oddzielone średnikami: BODY {

załącznik w tle: naprawiony;

obraz w tle: url (obrazy / BG.gif);

} Pierwsza linia przechwytuje obraz tła, a druga wskazuje adres pliku zawierającego obraz tła względem adresu strony. Te dwie linie można zapisać w jednym złożonym poleceniu CSS w następujący sposób: background: url (images / BG.gif) fixed;

Krok 3

Wklej cały kod, aby naprawić tło w tekście strony. W gotowej postaci może wyglądać tak:

BODY {background: url (images / BG.gif) poprawiony;}

Oczywiście musisz zastąpić lokalizację i nazwę pliku obrazu tła. Lepiej umieścić kod przed tagiem, chociaż nie jest to warunek konieczny.

Zalecana: