javascript - Kurs HTML i CSS
HTML5 / Blokowanie wyświetlania <link "stylesheet" blocking, script blocking, style blocking>(interpretuje: Opera 91, Chrome 105) Zewnętrzny arkusz stylów CSS: <link rel="stylesheet" href="style.css" blocking="render"> Skrypt JavaScript: <script blocking="render"></script> Wewnętrzny arkusz stylów CSS: <style blocking="render">...</style> style.css Lokalizacja zewnętrznego arkusza stylów CSS Przeglądarka internetowa może wykonywać niektóre operacje równocześnie. Czasami mogłoby to jednak prowadzić do nieoczekiwanych rezultatów. Dlatego na przykład osadzenie zewnętrznego...
- 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...
- HTML5 / Uwierzytelnienie <audio crossorigin, img crossorigin, link crossorigin, script crossorigin, video crossorigin>
Odtwarzacz dźwiękowy audio - wersja podstawowa: <audio src="lokalizacja" crossorigin></audio> Odtwarzacz dźwiękowy audio - wersja rozszerzona: <audio src="lokalizacja" crossorigin="uwierzytelnienie"></audio> Obrazek - wersja podstawowa: <img src="lokalizacja" crossorigin> Obrazek - wersja rozszerzona: <img src="lokalizacja" crossorigin="uwierzytelnienie"> Zewnętrzny zasób - wersja podstawowa: <link href="lokalizacja" crossorigin> Zewnętrzny zasób - wersja rozszerzona: <link...
- HTML5 / Automatyczne zogniskowanie <... autofocus>
(interpretuje: Internet Explorer 10, Firefox 4, Opera 10, Chrome 5) Elementy bez znacznika zamykającego (np. INPUT): <element autofocus> Elementy ze znacznikiem zamykającym (np. TEXTAREA): <element autofocus>...</element> element Dowolny znacznik HTML 4.01 lub HTML5 Atrybut logiczny (wstawiany bez wartości), dzięki któremu po załadowaniu strony, kursor tekstowy zostanie automatycznie umieszczony w tak zaznaczonym polu formularza. Chociaż typowym zastosowanie atrybutu autofocus są...
- HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
Blokada wszystkich potencjalnie niebezpiecznych funkcji: <iframe sandbox></iframe> Odblokowanie wybranych funkcji: <iframe sandbox="pozwolenia"></iframe> pozwolenia Należy podać dowolną liczbę poniższych wartości rozdzielając je spacjami: allow-downloads - zezwala pobierać pliki - zarówno standardową metodą jak i poprzez atrybut download. allow-forms - pozwala wysyłać formularze. allow-modals - pozwala otwierać okna modalne, tzn. takie które blokują stronę dopóki użytkownik ich nie...
Wykaz skryptów / Pozostałe skryptyAktywne przyciski Przyciski które zmieniają wygląd, po wskazaniu ich myszką (przydatne przy tworzeniu menu). Data aktualizacji strony Automatyczne wyświetlenie daty ostatniej aktualizacji strony. Aktualna data Wyświetlenie na stronie aktualnej daty. Nowość Sygnalizowanie nowości bezpośrednio w spisie treści lub na każdej ze stron, poprzez wyświetlenie specjalnego obrazka albo napisu. System newsów Automatyczny system wiadomości na stronie WWW, które są wyświetlane tylko przez określony...
- Tekst HTML / Kod komputerowy <code>
<code>...</code> wyświetlanie: w linii Pozwala wprowadzić fragment kodu komputerowego ("wyciąg" z programu lub źródła dokumentu), który jest napisany czcionką monotypiczną (tak jak w przypadku tekstu preformatowanego). Nie uwzględnia on jednak dodatkowych spacji, tabulacji ani znaków końca linii (trzeba używać <br>) oraz jest automatycznie zawijany. Ponieważ powyższy znacznik nie uznaje znaków końca linii, dodatkowych spacji, a także nie blokuje zawijania tekstu na ekranie, zamiast niego...
- Tekst HTML / Blokada indeksowania fragmentów treści <... data-nosnippet>
<div data-nosnippet>...</div> <span data-nosnippet>...</span> <section data-nosnippet>...</section> Co zrobić, jeśli w opisie naszej strony w wynikach wyszukiwania Google wyświetlają się nieadekwatne treści? Może to mieć miejsce, m.in. kiedy w treści strony są umieszczone jakieś elementy interfejsu użytkownika. Na przykład jeśli w naszym serwisie znajdują się fragmenty przykładowych tekstów (kody źródłowe, polecenia, wzory itp.), możemy chcieć ułatwić użytkownikowi skorzystanie z nich...
- Formularze HTML / Przycisk <button>
<button type="rodzaj">Treść przycisku</button> gdzie "rodzaj" określa typ przycisku i można tutaj podać: "submit" - przycisk wysłania formularza (domyślnie) "reset" - przycisk wyczyszczenia danych "button" - zwykły przycisk Wprowadza na ekran przycisk. Polecenie to jest zbliżone do przycisków: wysłania oraz wyczyszczenia formularza, a także do: <input type="button" value="napis">. Jednak pozwala ono dodatkowo, wprowadzić do przycisku grafikę, tabelkę i inne elementy - wystarczy umieścić...
- HTML5 / Filmy i dźwięk <video, audio, source>
Spis treści <video, audio, source> Wstęp Filmy i dźwięk Atrybuty odtwarzacza autoplay controls loop muted playsinline poster preload width, height Formaty audio/wideo MP3/MP4 OGG/OGV Kodeki Kodeki MP4 Kodeki OGG/OGV Wstęp Przed pojawieniem się języka HTML5, istniały już różne sposoby osadzania treści multimedialnych audio/wideo na stronach internetowych: Osadzenie pliku Uniwersalny sposób odtwarzania plików Niestety miały one spore wady: Większość z nich nie...