Kolor tła | Dzieki temu poleceniu można ustawic kolor tła dla danego elementu Selektor{background-color:kolor;} *{background-color:red;} |
Tło obrazkowe | Dzieki temu poleceniu możemy ustawić tło obrazkowe, selektor {background-image: url(adres);} *{background-image: url("file:///c:/CSS/_rozwiazanie/tla_marginesy/grafiki/tlo_1.jpg");} |
Przetwarzanie tła | Dzieki temu poleceniu można ustalić jeden z czterech sposobów powtarzania sie obrazka jako tła selektor{background-repeat:powtarzanie;} *{background-repeat:repeat-x;} |
Pozycja tła | dzieki temu poleceniu można ustalić pozycje obrazka w ramkach tła. Nie możliwe to jest przy wartości atrybutu powtarzania: repeat selektor{background-position: pozycja;} *{background-position:center;} |
Zaczepienie tła | Domyślnie tło obrazkowe przesuwa sie wraz z przewijaną stroną.Poleceniem tym można sprawić że tło bedzie nieruchome w czasie przewijania zawartości strony. selektor{background-attachment:zaczepienie;} *{background-attachment:fixed;} |
Łączenie atrybutów tła | Dzięki temu poleceniu można w jednym miejscu zebrać atrybuty dotyczące tła. selektor {background: wartości atrybutów;} p {color: #800000; background: #00ff00 url(../../grafiki/cwiczenie_13/tlo_css.jpg) norepeat scroll center;} |
Gradient liniowy | Gradient to wypełnienie tłem płynnym przejściu kilku kolorów. selektor { background: linear-gradient(kierunek, kolor1 odległość1, kolor2 odległość2...) } * {background: linear-gradient(to bottom, black 0%, white 100%)} |
Gradient promienisty | Gradient promienisty to tło 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...) } * {background: repeating-radial-gradient(white 33%, black 66%)} |