Przejdź do treści

CSS / Tło

Powtórka

Sprawdź, czy pamiętasz, za co odpowiadają poniższe fragmenty kodu źródłowego CSS. W razie wątpliwości kliknij odnośnik "Zobacz więcej..." pod wybraną grupą przykładów.

Jak zmienić kolor tła dowolnego elementu?

selektor { background-color: kolor }

Zobacz więcej...

Jak ustawić tło graficzne (obrazek, zdjęcie) pod dowolnym elementem? Jak ustalić rozmiary obrazka w tle?

selektor { background-image: url(ścieżka dostępu do obrazka) }
selektor { background-image: url(ścieżka dostępu do obrazka 1), url(ścieżka dostępu do obrazka 2),... }

Zobacz więcej...

W jaki sposób zapobiec powielaniu grafiki wstawionej w tle albo powielić ją tylko w jednym kierunku (poziomo lub pionowo)?

selektor { background-repeat: powtarzanie }
selektor { background-repeat: powtarzanie obrazka 1, powtarzanie obrazka 2,... }

Zobacz więcej...

Jak ustawić obrazek (grafikę, zdjęcie) w tle w określonej pozycji?

selektor { background-position: pozycja }
selektor { background-position: pozycja obrazka 1, pozycja obrazka 2,... }

Zobacz więcej...

Jak zrobić tło graficzne (obrazek, zdjęcie), które nie przesuwa się przy przewijaniu strony?

selektor { background-attachment: zaczepienie }
selektor { background-attachment: zaczepienie obrazka 1, zaczepienie obrazka 2,... }

Zobacz więcej...

W jaki sposób usunąć tło spod wewnętrznych marginesów elementu, ale wyświetlić je pod treścią?

selektor { background-clip: przycinanie }
selektor { background-clip: przycinanie obrazka 1, przycinanie obrazka 2,... }

Zobacz więcej...

W jaki sposób określić pozycję obrazka tła, względem której będą liczone wszelkie przesunięcia?

selektor { background-origin: początek }
selektor { background-origin: początek obrazka 1, początek obrazka 2,... }

Zobacz więcej...

W jaki sposób przeskalować obrazek wstawiony w tle, tak żeby pasował idealnie?

selektor { background-size: rozmiary }
selektor { background-size: rozmiary obrazka 1, rozmiary obrazka 2,... }

Zobacz więcej...

Jak można najłatwiej ustawić kilka własności tła w jednym poleceniu?

selektor { background: wartości atrybutów }
selektor { background: wartości atrybutów obrazka 1, wartości atrybutów obrazka 2... }

Zobacz więcej...

Jak wypełnić tło płynnym przejściem kilku kolorów w postaci gradientu?

selektor { background: linear-gradient(kierunek, kolor1 odległość1, kolor2 odległość2...) }
selektor { background: repeating-linear-gradient(kierunek, kolor1 odległość1, kolor2 odległość2...) }

Zobacz więcej...

Jak wypełnić tło płynnym przejściem kilku kolorów, wywołując efekt trójwymiarowej kuli lub oświetlenia latarki?

selektor { background: radial-gradient(kształt rozmiar at pozycja, kolor1 odległość1, kolor2 odległość2...) }
selektor { background: repeating-radial-gradient(kształt rozmiar at pozycja, kolor1 odległość1, kolor2 odległość2...) }

Zobacz więcej...

Jak usunąć wcześniej dodane tło?

selektor { background: none }

Zobacz więcej...

Komentarze

Zobacz więcej komentarzy

Facebook