przykład - Kurs HTML i CSS
- HTML5 / Priorytet ładowania <img fetchpriority, link fetchpriority, script fetchpriority>
...fetchpriority="high", należy umieścić ten atrybut w tagu <img>, <link> lub <script> dla zasobów, które mają mieć wysoki priorytet pobierania. Na przykład: <img src="image.jpg" fetchpriority="high"> lub <link rel="preload" as="style" href="style.css" fetchpriority="high">. To zapewni, że przeglądarka pobierze te zasoby z wyższym priorytetem.
- HTML5 / Przypisanie pola do formularza <button form, fieldset form, input form, object form, output form, select form, textarea form>
(interpretuje: Firefox 4, Opera 10, Chrome 10) Przycisk: <button form="identyfikator">...</button> Grupa pól formularza: <fieldset form="identyfikator">...</fieldset> Pole formularza: <input form="identyfikator"> Obiekt: <object form="identyfikator"></object> Dane wyjściowe: <output form="identyfikator">...</output> Lista rozwijalna: <select form="identyfikator">...</select> Obszar tekstowy: <textarea form="identyfikator">...</textarea> identyfikator Należy podać wartość...
- HTML5 / Nadpisanie atrybutów formularza <button formaction formenctype formmethod formnovalidate formtarget, input "submit, image" formaction formenctype formmethod formnovalidate formtarget>
(interpretuje: Internet Explorer 10, Firefox 4, Opera 15, Chrome 9) Przycisk wysłania formularza - akcja: <button formaction="akcja">...</button> Przycisk wysłania formularza - typ kodowania: <button formenctype="kodowanie">...</button> Przycisk wysłania formularza - metoda: <button formmethod="metoda">...</button> Przycisk wysłania formularza - pominięcie walidacji: <button formnovalidate>...</button> Przycisk wysłania formularza - cel: <button formtarget="cel">...</button> Pole...
- HTML5 / Pominięcie walidacji formularza <form novalidate>
(interpretuje: Internet Explorer 10, Firefox 4, Opera 15, Chrome 10) <form novalidate>...</form> novalidate to atrybut logiczny (wstawiany bez wartości), który pozwala pominąć wszelką weryfikację pól formularza. Oznacza to, że użytkownik będzie mógł wysłać formularz, nawet jeżeli nie wypełni wszystkich obowiązkowych pól albo poda nieprawidłowe wartości (np. wpisze adres e-mail w niepoprawnym formacie). Przykład <form novalidate, input required> Mimo oznaczenia pola jako obowiązkowe...
- HTML5 / Tryb wpisywania <... inputmode>
...wyszukiwania. Urządzenia mobilne są wyposażone w klawiaturę ekranową, która potrafi dopasować zestaw klawiszy do typu wprowadzanej wartości. Na przykład przy wprowadzaniu wartości numerycznej, dostępne mogą być tylko cyfry, przecinek i minus. Możemy ręcznie wymusić określony tryb wprowadzania tekstu poprzez przypisanie atrybutu inputmode="...". Warto zauważyć, że niektóre wartości atrybutu trybu wpisywania odpowiadają typom pól formularza: inputmode="text" i type="text...
- HTML5 / Leniwe ładowanie <iframe loading, img loading>
...inteligentne ładowanie? Inteligentne ładowanie można włączyć, stosując atrybut loading="lazy" dla elementów, takich jak <img> i <iframe>. Na przykład: <img src="obrazek.jpg" loading="lazy">. Dzięki temu zasoby te będą ładowane tylko wtedy, gdy użytkownik przewinie stronę w ich pobliże. Dlaczego leniwe ładowanie? Leniwe ładowanie jest stosowane, aby przyspieszyć czas ładowania początkowej części strony, zmniejszając ilość zasobów ładowanych od razu. Pozwala to na szybsze...
- HTML5 / Tłumaczenie językowe <... translate>
...Często są one również wbudowane w przeglądarki internetowe lub system operacyjny. Jednak nie każdy fragment tekstu powinien być tłumaczony. Na przykład kod programu, zawierający instrukcję w języku angielskim, powinien zostać nietknięty przez aplikację tłumaczącą. Aby zabronić tłumaczenia tekstu, należy do elementu, który go obejmuje, przypisać atrybut translate="no".
- Drukowanie CSS / Rozmiar papieru @page {size}
@page { size: rozmiar } Jako rozmiar można podać: auto - wartość domyślna (najczęściej portrait) portrait - wydruk na kartce w orientacji pionowej (portret) landscape - wydruk na kartce w orientacji poziomej (krajobraz) jedna wartość długości - kwadratowy obszar wydruku o podanych rozmiarach wyrażonych w jednostkach innych niż procent dwie wartości długości - szerokość i wysokość obszaru wydruku rozdzielone od siebie spacją Typowa drukarka najczęściej drukuje strony w orientacji...
- Drukowanie CSS / Druk dwustronny @page :left :right
Strony lewe: @page :left { cecha: wartość } Strony prawe: @page :right { cecha: wartość } Jako cecha i wartość można wstawić jedną lub więcej deklaracji odpowiednich dla kontekstu strony. Niektóre drukarki posiadają specjalny podajnik papieru pozwalający automatycznie zadrukowywać kartki po ich obu stronach. Nawet jeśli urządzenie nie ma wbudowanej takiej funkcji, druk dwustronny można zrealizować ręcznie: najpierw drukując nieparzyste strony, a następnie przekładając je odwrotnie z...
- Drukowanie CSS / Typ strony wydruku {page}
@page strona { cecha: wartość } selektor { page: strona } Jako strona należy wpisać dowolny tekst, który może się składać z małych i wielkich liter łacińskich (bez polskich znaków diakrytycznych), cyfr i myślników "-". Nie może się jednak zaczynać cyfrą ani myślnikiem. Aby użyć innych znaków, należy je poprzedzić odwróconych ukośnikiem "\". Jako cecha i wartość można wstawić jedną lub więcej deklaracji odpowiednich dla kontekstu strony. Selektorem może być dowolny znacznik blokowy - np. table...