elementy - Kurs HTML i CSS
Układ wielokolumnowy CSS / Multi-column layout...najczęściej inaczej niż w gazecie właściwa treść artykułu znajduje się w pojedynczej kolumnie, a pozostałe kolumny są przeznaczone na menu lub inne elementy kontekstowe (popularne odnośniki, inne podobne artykuły czy reklamę). Jest to zatem sytuacja zupełnie inna, choć w wielu przypadkach całkowicie pożądana. Gazetowy układ wielokolumnowy teoretycznie można próbować symulować za pomocą tabel. Ma to jednak spore wady, które praktycznie dyskwalifikują takie rozwiązanie: Inaczej niż w...
HTML5 / Artykuł <article>...zawierać wewnętrzne sekcje i tak jak one często ma na początku określony nagłówek (zobacz również: "Sekcje / Nagłówki sekcji" w rozdziale "Nowe elementy HTML5"). Wstawienie na początku znacznika ARTICLE tytułu nagłówkowego H1-H6 nie jest jednak wymagane. Na przykład często przy dodawaniu komentarzy użytkowników pod artykułem na stronie nie wypełnia się tytułu komentarza. Jeśli nie jesteśmy pewni, czy na stronie powinniśmy wstawić znacznik ARTICLE czy SECTION, trzeba sobie odpowiedzieć na...
- Układ elastyczny CSS / Kolejność {order}
(CSS 3 - interpretuje Internet Explorer 10, Firefox, Opera 12, Chrome) selektor { order: kolejność } Selektorem mogą być dzieci kontenera elastycznego (ale nie sam kontener). Natomiast kolejność to liczba całkowita, domyślnie równa zero. Elementy z przypisaną niższą wartością, będą wyświetlane w pierwszej kolejności. Wartości ujemne pozwalają przesunąć dowolny element na miejsce przed pierwszym. Elementy z przypisaną taką samą liczbą, wyświetlą się w kolejności ich występowania w kodzie...
- Układ elastyczny CSS / Marginesy automatyczne
...kontenera. Działa to poprzez równomierne rozłożenie dostępnego miejsca po obu stronach elementu, co skutkuje wyśrodkowaniem. Jak ustawić elementy obok siebie CSS? Aby ustawić elementy obok siebie w kontekście flexbox CSS, można to osiągnąć ustawiając "margin-right: auto" na pierwszym elemencie lub "margin-left: auto" na drugim elemencie. To spowoduje, że pierwszy element przylegnie do lewej krawędzi kontenera, a drugi do prawej krawędzi, a dostępna przestrzeń zostanie...
Operacje na tablicach w JavaScript - Array.prototype / Przekształcanie tablicy na tekst z separatorem - joinArray.prototype.join() Array.prototype.join(separator) Parametry: String separator - tekst rozdzielający poszczególne elementy tablicy (domyślnie: ",") Wartość: String - tekstowe połączenie kolejnych elementów tablicy Przekształca tablicę na tekst podobnie jak funkcja Array.prototype.toString, ale pozwala dodatkowo określić tekst, za pomocą którego zostaną rozdzielone kolejne elementy (dla funkcji Array.prototype.toString jest to zawsze: ","). Przykład Array.prototype.join var items...
- Operacje na tablicach w JavaScript - Array.prototype / Wycinanie części elementów tablicy - slice
...indeks elementu początkowego (domyślnie: 0) Number end - indeks elementu po końcowym (domyślnie: długość tablicy) Wartość: Array - wycięte elementy Tworzy nową tablicę, będącą wycinkiem, składający się z kolejnych elementów poczynając od początkowego (na który wskazuje indeks start) aż do końcowego (przed indeksem end). Jeżeli do funkcji nie zostaną przekazane żadne argumenty, będzie zwrócona kopia całej tablicy. Jeżeli argument end nie zostanie podany, wycinek będzie zawierał...
- Operacje na tablicach w JavaScript - Array.prototype / Wycinanie i zastępowanie elementów tablicy - splice
...Number deleteCount - ile kolejnych elementów usunąć bądź podmienić item1, item2... - lista elementów na podmianę Wartość: Array - wycięte elementy Tworzy nową tablicę, będącą wycinkiem, składający się z kolejnych elementów poczynając od tego, na który wskazuje indeks start i zawierającym tyle elementów, na ile wskazuje argument deleteCount. Następnie w miejsce wycinka są wstawiane elementy, określone argumentami: item1, item2..., a jeżeli ich nie podamy, wycinek po prostu jest...
- Operacje na tablicach w JavaScript - Array.prototype / Sprawdzanie warunku dla wszystkich elementów - every
...elementów tablicy funkcja testująca zwraca wartość true Wyjątki: TypeError - callbackfn nie jest funkcją Pozwala sprawdzić, czy wszystkie elementy tablicy spełniają określony warunek. Elementy, które nie zostały jawnie dodane do tablicy, są pomijane. Jest odpowiednikiem operatora && (i - ang. and) przy działaniach na wartościach skalarnych. Przykład Array.prototype.every var items = [3, 2, 1]; var f = function (x) { return x > 0; }; items.every(f); // true f...
- Operacje na tablicach w JavaScript - Array.prototype / Iterowanie po elementach tablicy - forEach
...wywołania wewnątrz ciała funkcji (domyślnie: undefined) Wyjątki: TypeError - callbackfn nie jest funkcją Pozwala przejrzeć kolejno wszystkie elementy tablicy. Elementy, które nie zostały jawnie dodane do tablicy, są pomijane. Nie ma możliwości przerwania w rozsądny sposób przeglądania tablicy przed jej końcem. W takim przypadku lepiej użyć pętli for albo ewentualnie funkcji Array.prototype.some bądź Array.prototype.every. Przykład Array.prototype.forEach var items = [3, 2, 1]; var...
- Operacje na tablicach w JavaScript - Array.prototype / Odfiltrowywanie elementów tablicy - filter
...ciała funkcji (domyślnie: undefined) Wartość: Array - nowa tablica Wyjątki: TypeError - callbackfn nie jest funkcją Pozwala pobrać z tablicy elementy, które spełniają określony warunek. Elementy, które nie zostały jawnie dodane do tablicy, są pomijane. Nie zmienia oryginalnej tablicy, ale zwraca nową. Przykład Array.prototype.filter var items = [3, 2, 1]; var f = function (x) { return x > 1; }; items.filter(f); // [3, 2] items; // [3...