element - Kurs HTML i CSS
Selektory pseudoklas CSS / Łączenie selektorów...selektor uniwersalny selektory atrybutów, selektor identyfikatora, selektor klasy lub selektory pseudoklas (w dowolnej kolejności) selektory pseudoelementów Zespół selektorów z punktu 1 i 2 nazywamy selektorem prostym. W jednej regule może wystąpić kilka selektorów prostych - każdy rozdzielony przez tzw. kombinator, tj. znaki spacji, ">" lub "+", które są wykorzystywane przy tworzeniu selektorów: potomka, dziecka i braci. Selektor pseudoelementów może się znajdować tylko za ostatnim...
- Selektory pseudoklas CSS / Korzeń :root
(CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome) :root { cecha: wartość } Wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Każdy dokument HTML ma w drzewie dokumentu dokładnie jeden korzeń, tzn. element najbardziej nadrzędny, który nie ma żadnego rodzica, za to zawiera w sobie (bezpośrednio lub poprzez zagnieżdżenie) wszystkie inne elementy dokumentu. W języku HTML korzeniem jest zawsze element HTML...
- Marginesy CSS / Model pudełkowy CSS
Źródło: Cascading Style Sheets, Level 2 Każdy element generuje w dokumencie prostokątny obszar zwany pudełkiem (ang. Box model). Pudełko składa się z: Zawartości - "Content" (np. test, obrazek itd.) Otaczających marginesów wewnętrznych - "Padding" Obramowania - "Border" Marginesów - "Margin" Ostatnie trzy składniki są opcjonalne, tzn. mogą mieć wartość zero. Obwód (zewnętrzny) każdego z czterech obszarów nazywamy krawędzią ("Edge"). Według CSS rozmiary elementu (własności width oraz...
- Marginesy CSS / Załamywanie marginesów
W przypadku sąsiadowania ze sobą lub zagnieżdżania wewnątrz siebie elementów posiadających marginesy, może zajść proces załamywania marginesów zewnętrznych (ang. collapsing margins), polegający na połączeniu kilku sąsiadujących odstępów w jeden o rozmiarze pojedynczego marginesu, a nie sumy składowych. Według CSS 2.1 załamywane mogą być tylko marginesy pionowe w następujących przypadkach: Dwa lub więcej sąsiadujące marginesy pionowe bloków bez "oblewania" (float) zostają załamane. Wynikowy...
- Obramowanie CSS / Nawis obramowania obrazkowego {border-image-outset}
...obramowania: górną, prawą, dolną, lewą Nawis obramowania obrazkowego to jego część wystająca na zewnątrz poza krawędzie tradycyjnego obramowania elementu. Dodanie nawisu nie wpływa na położenie elementu - element najpierw jest renderowany w określonym miejscu na stronie, a dopiero potem jest do niego ewentualnie dorysowywany nawis. Skutkiem tego może być zmniejszenie się faktycznie widocznego marginesu elementu, oddzielającego go do sąsiednich bloków. Jeżeli szerokość marginesu będzie...
- Rozmiary CSS / Szerokość {width}
selektor { width: szerokość } Selektorem może być dowolny znacznik wyświetlany w bloku lub element zastępowany [zobacz: Wstawianie stylów]. Natomiast jako "szerokość" należy podać wartość szerokości, jaką ma mieć dany element (używając jednostek długości). Polecenie nie odnosi się do elementów inline! Polecenie to pozwala ustalić dokładną szerokość różnych elementów (np. akapitu, wykazu, poziomej linii, tabeli, obrazka itd.). Przykład {width} To jest akapit o szerokości 30% (width: 30%)...
- Rozmiary CSS / Wysokość {height}
selektor { height: wysokość } Selektorem może być dowolny znacznik wyświetlany w bloku lub element zastępowany [zobacz: Wstawianie stylów]. Natomiast jako "wysokość" należy podać wartość wysokości, jaką ma mieć dany element (używając jednostek długości). Polecenie nie odnosi się do elementów inline! Polecenie to pozwala ustalić dokładną wysokość różnych elementów (np. akapitu, wykazu, poziomej linii, tabeli, obrazka itd.). Przykład {height} To jest akapit o wysokości 5cm (height: 5cm). To...
- Rozmiary CSS / Wysokość i marginesy automatyczne
...analogiczne zagadnienie, jak Szerokość i marginesy automatyczne, tzn. specjalne zasady dopasowywania wysokości (height) oraz pionowych marginesów elementów (margin-top, margin-bottom), po przypisaniu im wartości auto. Przedstawione poniżej punkty 1-3 obejmują również elementy pozycjonowane relatywnie. 1. Elementy inline, nie-zastępowane Jeżeli własności top, bottom, margin-top lub margin-bottom mają przypisaną wartość auto, przyjmują ostateczną wartość zero. Własność height nie ma...
- Kursory CSS / Kursor obrazkowy {cursor: url}
...ustalony jednopikselowy tzw. gorący punkt (ang. hotspot). Ten punkt jest miejscem aktywnym kursora, tzn. właśnie za jego pomocą wskazywane są elementy. Zwykle leży on na czubku grota strzałki lub w centrum krzyżyka kursora. Możemy jednak ten punkt przesunąć w prawo (wartość x) lub/i w dół (wartość y) względem lewego-górnego narożnika grafiki (wymagane jest podanie pozycji zawsze za pomocą dwóch współrzędnych). Przykład {cursor: url} Wskaż ten tekst myszką Pytania i odpowiedzi...
- Drukowanie CSS / Przełamanie strony {page-break-before, page-break-after}
(interpretuje: Internet Explorer, Firefox, Opera, Chrome) Przed elementem: selektor { page-break-before: wartość } Po elemencie: selektor { page-break-after: wartość } Selektorem może być znacznik wyświetlany w bloku [zobacz: Wstawianie stylów]. Natomiast jako "wartość" należy podać: always - przełamanie zawsze auto - brak ograniczeń left - następna strona formatowana jako lewa right - następna strona formatowana jako prawa avoid - unikanie przełamania Polecenie to wymusza na...