background - Kurs HTML i CSS
CSS dla zielonych / Tapeta CSS {background-color, background-image, color}...pojedynczego kafelka tapety, wstawienie go w tle strony jest bardzo proste. Wystarczy w arkuszu stylów dodać następującą regułę stylów: body { background-color: kolor tła; background-image: url(ścieżka dostępu do obrazka); color: kolor tekstu; } W wyróżnionych miejscach należy wpisać odpowiednio: kolor tła Definicja koloru który wyświetli się w tle strony w następujących przypadkach: w miejscach gdzie grafika tapety będzie miała elementy przezroczyste (jest to możliwe np. w formacie...
- Tło CSS / Usunięcie tła {background: none, background-color: transparent}
selektor { background: none } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Polecenie umożliwia wykasowanie zdefiniowanego wcześniej tła. Okazuje się ono przydatne, częściej niż można by sądzić. Na przykład wyobraźmy sobie, że w zewnętrznym arkuszu stylów określamy ogólne własności dla wszystkich stron naszego serwisu. Załóżmy, że znajduje się tam m.in. deklaracja tła obrazkowego stron. Jeśli teraz zechcemy...
- Tło CSS / Atrybuty mieszane tła {background}
Spis treści {background} Atrybuty mieszane tła {background} Tło graficzne obok tekstu Wielokrotne atrybuty mieszane Atrybuty mieszane tła {background} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background: wartości atrybutów } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "wartości atrybutów" należy wpisać konkretne wartości atrybutów, dotyczących tła, które...
- Tło CSS / Zaczepienie tła obrazkowego {background-attachment}
Spis treści {background-attachment} Zaczepienie tła obrazkowego {background-attachment} Wielokrotne zaczepienie Zaczepienie tła obrazkowego {background-attachment} (interpretuje Internet Explorer 9, Firefox, Opera, Chrome) selektor { background-attachment: zaczepienie } Jako "zaczepienie" należy wpisać: scroll - przewijanie tła (domyślnie) fixed - tło nieruchome względem okna przeglądarki local - tło nieruchome względem elementu (jeśli posiada on suwaki), ale przewijane względem...
- Tło CSS / Tło obrazkowe {background-image}
Spis treści {background-image} Tło obrazkowe {background-image} Wielokrotne tło obrazkowe Tło obrazkowe {background-image} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background-image: url(ścieżka dostępu do obrazka) } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "ścieżka dostępu do obrazka" należy podać miejsce, gdzie znajduje się obrazek, który chcemy wstawić...
- Tło CSS / Gradient liniowy {background: linear-gradient repeating-linear-gradient}
Spis treści {background: linear-gradient repeating-linear-gradient} Gradient liniowy {background: linear-gradient} Powtarzany gradient liniowy {background: repeating-linear-gradient} Gradient liniowy {background: linear-gradient} (CSS 3 - interpretuje Internet Explorer 10, Firefox, Opera, Chrome) selektor { background: linear-gradient(kierunek, kolor1 odległość1, kolor2 odległość2...) } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli...
- Tło CSS / Gradient promienisty {background: radial-gradient repeating-radial-gradient}
Spis treści {background: radial-gradient repeating-radial-gradient} Gradient promienisty {background: radial-gradient} Powtarzany gradient promienisty {background: repeating-radial-gradient} Gradient promienisty {background: radial-gradient} (CSS 3 - interpretuje Internet Explorer 10, Firefox, Opera, Chrome) selektor { background: radial-gradient(kształt rozmiar at pozycja, kolor1 odległość1, kolor2 odległość2...) } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1...
- Tło CSS / Kolor tła {background-color}
selektor { background-color: kolor } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "kolor" należy podać definicję koloru. Wpisanie "transparent" ustali tło przezroczyste. Polecenie umożliwia wstawienie tła o określonym kolorze pod danym elementem (tekstem). Jeśli definiowane własności mają odnosić się do całej strony (np. kolor tła strony), można użyć selektora BODY lub HTML. Przykład...
- Tło CSS / Powtarzanie tła obrazkowego {background-repeat}
Spis treści {background-repeat} Powtarzanie tła obrazkowego {background-repeat} Wielokrotne powtarzanie Powtarzanie tła obrazkowego {background-repeat} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background-repeat: powtarzanie } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "powtarzanie" należy wpisać: repeat - powtarzanie tła w obu kierunkach (domyślnie)...
- Tło CSS / Pozycja tła obrazkowego {background-position}
Spis treści {background-position} Pozycja tła obrazkowego {background-position} Wielokrotna pozycja Pozycja tła obrazkowego {background-position} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background-position: pozycja } Selektorem może być znacznik wyświetlany w bloku albo zastępowany [zobacz: Wstawianie stylów]. Natomiast jako "pozycja" należy wpisać: Jedną wartość: center - obrazek na środku (w centrum) left - obrazek po lewej right - po prawej top...