element - Kurs HTML i CSS
Pozycjonowanie CSS / Wyświetlanie {display}...{ display: sposób } Selektorem może być praktycznie dowolny znacznik [zobacz: Wstawianie stylów]. Natomiast jako "sposób" należy podać: block - element będzie wyświetlony w bloku (odstęp z góry i z dołu) inline - element będzie wyświetlony w linii (sąsiadująco z innymi) list-item - element wykazu: <li>...</li> none - element nie będzie wyświetlany inline-block - element zachowuje się podobnie jak element zastępowany (Firefox 3, Opera 7, Chrome, Konqueror) run-in - jeśli po elemencie...
HTML5 / Data i czas <time>...Data: -- Czas: :: Czas trwania Bieżąca data Bieżący czas <time>...</time> Zaznacz kod (function(form) { function generate() { var elements = form.elements; var datetime = ''; Array.prototype.filter.call(elements, function(element) { return element.type === 'number' }).forEach(function(element) { var value = parseInt(element.value, 10); if (isNaN(value)) { element.value = ''; } else { var min = parseInt(element.min, 10); var max = parseInt(element.max...
- Pozycjonowanie CSS / Nakładanie {z-index}
...(absolutne, relatywne lub ustalone). Natomiast jako "numer" należy wpisać pojedynczą liczbę, określającą, kolejność nakładania pozycjonowanych elementów (element z numerem 1 będzie na samym spodzie - zakryty przez inne). Można również wpisać auto, co ustali wartość automatyczną. Polecenie to pozwala określić, w jaki sposób mają się nakładać elementy pozycjonowane. Normalnie kolejność nakładania (zakrywania) zależy od kolejności wpisywania elementów w kodzie źródłowym dokumentu, tzn...
- HTML5 / Nowe atrybuty HTML5
Język HTML5 definiuje nie tylko zupełnie nowe elementy (znaczniki), ale również dodatkowe atrybuty, które można przypisywać również do elementów, które były zdefiniowane już w specyfikacji HTML 4.01. Atrybuty Zastosowanie Opis allow IFRAME Polityka uprawnień, która ma zostać zastosowana do zawartości elementu IFRAME allowfullscreen IFRAME Czy pozwolić zawartości elementu IFRAME na użycie funkcji requestFullscreen() as LINK (rel="preload" lub rel="modulepreload") Potencjalny...
- Oprawa graficzna / Zamiennik obrazkowy
...menu nawigacyjnego z orientacji pionowej do poziomej ani przeniesienie całej kolumny nawigacyjnej z lewej na prawą stronę. Jest jednak jeden ważny element, na zawartość którego nie można wpływać za pomocą CSS - obrazki. Można co prawda zmieniać rozmiary grafiki, dodawać obramowanie, ustalać pozycję i marginesy, ale nie da się wyświetlić innego zdjęcia bez modyfikacji kodu HTML. Jednak czy to stanowi jakiś problem? W pewnych sytuacjach tak: Przygotowując kilka alternatywnych arkuszy CSS...
Menu rozwijane, otwierane, wysuwane / Skrypt menu rozwijanego, otwieranego, wysuwanego...Na samym początku w wyróżnionych miejscach można zmienić domyślne ustawienia konfiguracyjne: czas rozwijania i czas zwijania pojedynczego elementu menu oraz opóźnienie przy otwieraniu i zamykaniu menu (tylko w wersji otwieranej - szczegóły dalej w tym rozdziale). Wszystkie czasy są podane w milisekundach (1 s = 1000 ms). Wartości te zostaną przypisane wszystkim takim blokom menu na stronie, dla których nie określimy inaczej. Następnie na stronie, gdzie ma być umieszczone menu...
- HTML5 / Okienko popover <... popover, button "button" popovertarget popovertargetaction, input "button" popovertarget popovertargetaction>
(interpretuje: Firefox 125, Opera 100, Chrome 114) Wersja podstawowa z przyciskiem zaawansowanym: <element id="identyfikator" popover> ... <button type="button" popovertarget="identyfikator" popovertargetaction="hide">Zamknij</button> </element> <button type="button" popovertarget="identyfikator">Otwórz/Zamknij</button> Wersja rozszerzona z przyciskiem zaawansowanym: <element id="identyfikator" popover="tryb">...</element> <button type="button" popovertarget="identyfikator...
- Obramowanie CSS / Dekoracja przełamania obramowania {box-decoration-break}
...np. p - akapit czy a - odsyłacz [zobacz: Wstawianie stylów]. Natomiast jako "dekoracja" należy wpisać: clone - każdy fragment przełamanego elementu będzie miał osobne obramowanie slice - wszystkie fragmenty przełamanego elementu będą miały wspólne obramowanie (domyślnie) Zdarza się, że na wydruku blok zostanie przełamany pomiędzy dwie kartki w taki sposób, że jego początek znajdzie się na końcu jednej strony, a koniec - na samym początku następnej. W takim przypadku standardowo...
- Pozycjonowanie CSS / Ustawienie {float, vertical-align}
...{float} Ustawienie w pionie {vertical-align} Ustawienie w poziomie {float} selektor { float: sposób } Polecenia nie można zastosować do elementów pozycjonowanych absolutnie. Selektorem może być praktycznie dowolny znacznik, który nie został wypozycjonowany absolutnie [zobacz: Wstawianie stylów]. Natomiast jako "sposób" należy podać: left - element ustawiony po lewej stronie, względem elementów sąsiadujących right - element ustawiony po prawej stronie, względem elementów...
- Definicje / Drzewo dokumentu
(document tree) Drzewo elementów umieszczonych w dokumencie źródłowym. Każdy element w takim drzewie ma dokładnie jednego rodzica, oprócz elementu podstawowego, czyli korzenia drzewa (root). Przykład Po wpisaniu: <html> <head> <title>...</title> </head> <body> <h1>...</h1> <p>...</p> <table> <tr> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> </tr> </table> </body> </html> Otrzymamy następujące drzewo dokumentu: gdzie...