język strony - Kurs HTML i CSS
HTML5 / Leniwe ładowanie <iframe loading, img loading>...domyślna) Język HTML pozwala na osadzanie w dokumencie m.in. zdjęć oraz widżetów. Może się zdarzyć, że użytkownik w ogóle nie przewinie strony do miejsca, w którym zostały umieszczone tego typu multimedia. Niestety przeglądarka załaduje wszystkie tego typu elementy - nawet znajdujące się na samym dole strony, które w tym momencie w ogóle nie są widoczne na ekranie. Jeśli zdjęcia lub widżety mają duży rozmiar, spowolni to wczytywanie całej strony. Dodatkowo może narazić na...
- HTML5 / Nowe elementy HTML5
...<h1>Nagłówek poziomu 1</h1> <h2>Nagłówek poziomu 2</h2> Warto wiedzieć, że w tym samym dokumencie może być więcej niż jeden znacznik H1. Ponadto język HTML5 nie nakłada obowiązku, aby taki element w ogóle się w nim znajdował. Choć nie jest to zalecane, można rozpocząć numerację nagłówków sekcji np. od elementu H2. Każda sekcja dokumentu (elementy: ARTICLE, ASIDE, NAV, SECTION) może mieć nagłówek. Sam element sekcji w żaden sposób nie wpływa jednak na poziom nagłówka sekcji w automatycznym...
- HTML5 / Napisy do filmów <track>
...VIDEO, AUDIO, SOURCE. Napisy wyświetlane zwykle na dole ekranu są - obok głosu lektora i dubbingu - jednym ze sposobów na przekład filmu na inny język niż ten, w którym pierwotnie został on nakręcony. Tekst tłumaczenia teoretycznie można zapisać bezpośrednio w ścieżce wideo. Wtedy jednak każde tłumaczenie filmu byłoby fizycznie osobnym plikiem wideo. Na dodatek użytkownik np. słabowidzący albo posiadający niewielki monitor, nie mógłby sterować wielkością tekstu napisów. Dlatego dużo lepiej...
- XHTML / Typy MIME dokumentów XHTML
...text/html Typ odpowiedni dla dokumentów HTML oraz XHTML 1.0, których autorzy pragną, aby mogły być wyświetlane w przeglądarkach, które nie obsługują języka XHTML w pełni. Dokumenty tego typu nie będą przetwarzane zgodnie z wymogami języka XML. Będzie to miało wpływ również na zachowanie skryptów JavaScript, korzystających ze standardu DOM oraz reguły arkuszy CSS. Domyślnym kodowaniem znaków - tzn. jeśli nie określimy inaczej - zwykle jest UTF-8, jednak może to zależeć od ustawień przeglądarki...
Drukowanie CSS / Druk dwustronny @page :left :right...Taki efekt można uzyskać stosując pseudoklasy :left i :right, które pozwalają ustawić różne marginesy wydruku dla stron lewych i prawych. W językach o kierunku tekstu od lewej do prawej (np. język polski lub angielski) pierwszą stroną dokumentu (okładką) jest strona prawa. Natomiast jeśli dokument zawiera w większości tekst w języku pisanym od prawej do lewej (np. język arabski lub hebrajski), pierwszą stroną będzie strona lewa. Przykład @page :left :right Druk dwustronny...
- Nagłówek i treść HTML / Struktura dokumentu HTML
...pozwalającą określić pewne ogólne wiadomości dotyczące dokumentu, m.in. sposób kodowania znaków, opis zawartości strony, jej autora czy język, w którym została napisana. Metainformacje nie wpływają bezpośrednio na wygląd dokumentu, lecz cechy które podają, są równie ważne. Chociaż nie są one wymagane, warto je stosować, ponieważ może to np. pomóc w odszukaniu strony przez wyszukiwarki sieciowe. Każdy dokument powinien zawierać obowiązkowo przynajmniej deklarację strony kodowej...
- HTML5 / Załącznik <figure, figcaption>
...możemy co najwyżej przenieść na inną podstronę, bo inaczej dokument utraciłby spójność. Przykład <figure> <p>Język HTML5 upraszcza deklarowanie strony kodowej dokumentu. Na <a href="#listing1">przykładzie 1</a> możemy się przekonać, jak to zrobić.</p> <figure id="listing1"> <pre><code> <meta charset="UTF-8"> </code></pre> </figure> <p>Krótszą formę ma również deklaracja typu dokumentu.</p> Warto zwrócić uwagę, że gdyby tekst akapitu był sformułowany w inny sposób, użycie...
- CSS dla zielonych / Zaczynamy kurs CSS!
Zapewne znasz już podstawy języka HTML - jeśli nie, zapraszam najpierw do lektury rozdziału: HTML dla zielonych. Skoro nadal czytasz, zapewne oznacza to, że potrafisz stworzyć przynajmniej prostą stronę internetową zawierającą tekst, obrazki i odsyłacze. Chociaż treść jest najważniejszym elementem każdej strony WWW, to przecież wygląd też się liczy. I właśnie do tego służy język CSS (Kaskadowe Arkusze Stylów). Zapamiętaj prostą zasadę: treść wraz ze znacznikami wprowadza się na stronę...
- HTML5 / Wstępne ładowanie <link "preload" as>
(interpretuje: Firefox 85, Opera 37, Chrome 50) <link rel="preload" as="rodzaj" type="typ" href="lokalizacja"> rodzaj W zależności od języka, w którym wybrane zasoby zewnętrzne są używane, można podać następujące wartości: w języku HTML - audio, document (dokument HTML), embed, frame, iframe, image, object, track, video w języku CSS - font, style (zewnętrzny arkusz stylów oraz import arkusza stylów) w języku JavaScript - fetch, json, script w języku XML - xslt (ang. Extensible...
- Selektory atrybutów CSS / Selektor atrybutu zawierającego łączniki
...przykład składnia lang|="en" kojarzy atrybuty: lang="en-us" lub lang="en-au", jak również lang="en". Selektor taki został przewidziany do obsługi języków (atrybut LANG), których skróty zawierają często łączniki (np. "en-US" to język angielski w Stanach Zjednoczonych, "en-AU" to język angielski w Australii). UWAGA! Polecenie nie interpretuje MSIE 6 (od wersji 7 wszystko jest już w porządku). W języku XHTML wszystkie nazwy atrybutów w selektorach muszą być pisane małymi literami. Przykład...