html - Kurs HTML i CSS
Odsyłacze HTML / Mapa odsyłaczy <img usemap, map, area>Spis treści <img usemap, map, area> Mapa odsyłaczy <img usemap, map, area> Nakładanie obszarów Mapa odsyłaczy <img usemap, map, area> <img src="ścieżka dostępu do obrazka" alt="tekst alternatywny" usemap="#nazwa_mapy"> <map id="nazwa_mapy" name="nazwa_mapy"> <area shape="kształt" coords="współrzędne" href="adres" alt="tekst alternatywny"> <area shape="kształt" coords="współrzędne" href="adres" alt="tekst alternatywny"> (...) </map> ścieżka dostępu do obrazka Lokalizacja na dysku...
- Nagłówek i treść HTML / Roboty <meta "robots, googlebot">
Spis treści <meta "robots, googlebot"> Roboty <meta "robots"> Niestandardowe dyrektywy robotów Googlebot <meta "googlebot"> Roboty <meta "robots"> <head> <meta name="robots" content="dyrektywy"> </head> gdzie jako "dyrektywy" należy wpisać: "index" - strona, na której wstawiono polecenie, będzie indeksowana przez roboty sieciowe (indeksery) - domyślnie "noindex" - strona, na której wstawiono polecenie, nie będzie indeksowana "follow" - przechodzenie do stron, do których odnoszą się...
- Formularze HTML / Pole wyboru <input "checkbox">
Spis treści <input "checkbox"> Pole wyboru <input "checkbox"> Domyślne zaznaczenie pola <input "checkbox" checked> Blokada pola <input "checkbox" disabled> Etykieta <label> Klawisz skrótu <input "checkbox" accesskey> Dynamiczne blokowanie pól formularza Pole wyboru <input "checkbox"> <form action="..."> <input type="checkbox" name="nazwa" value="wartość">Tu wpisz opis pola </form> gdzie jako "nazwa" należy wpisać nazwę danego pola (np. skróconą treść pytania), która nie powinna być...
Czcionki CSS / Wielkość czcionki {font-size}Spis treści {font-size} Wielkość czcionki {font-size} Najlepszy sposób ustalania wielkości czcionki Jednostka "em" Jednostka "px" Jednostka "pt" Podsumowanie Wielkość czcionki {font-size} selektor { font-size: rozmiar } Selektorem może być dowolny znacznik, w którym można wpisywać tekst, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "rozmiar" należy podać konkretną wielkość czcionki. Możliwe są tutaj cztery sposoby: Imienne...
- Nagłówek i treść HTML / Opis zawartości strony <meta "description">
...wstawić np. następujący znacznik: <meta name="description" content="Tu podaj opis twojej strony">. Należy jednak przy tym pamiętać, że w pliku *.html może się znajdować tylko jeden nagłówek dokumentu. Zatem opis strony dodajemy wewnątrz istniejącego elementu, a nie wstawiamy nowego! Ponadto w pliku *.html powinien się znajdować tylko jeden opis strony.
- HTML5 / Nowe elementy HTML5
Spis treści Wstęp Sekcje Nagłówki sekcji Znaczniki grupujące Semantyka tekstu Elementy osadzone Formularze Pole INPUT Elementy interaktywne Skrypty Wstęp Standard HTML5 nie jest już taki nowy, ale nadal mogą być do niego wprowadzane nowe znaczniki. Przeglądarki które ich jeszcze nie odsługują, zwykle próbują wyświetlać je w linii. Nie jest to zgodne z domyślnym sposobem prezentacji części z tych elementów określonym w specyfikacji. Aby ujednolicić sposób wyświetlania...
- HTML5 / Napisy do filmów <track>
Spis treści <track> Napisy do filmów <track> Rodzaj napisów WebVTT Ustawienia napisu Dialogi Formatowanie tekstu Stylizacja napisów Napisy do filmów <track> (interpretuje: Internet Explorer 10, Firefox 31, Opera 12.1, Chrome 23) <video> <source src="lokalizacja pliku w formacie 1" type='format 1'> <source src="lokalizacja pliku w formacie 2" type='format 2'> (...) <track src="napisy.vtt" default> (...) Treść alternatywna </video> gdzie: napisy.vtt Lokalizacja pliku...
- Nagłówek i treść HTML / Ikona strony <link "shortcut icon">
...elementu <head>...</head> - następujący znacznik: <link rel="shortcut icon" href="/favicon.ico">. Trzeba jednak przy tym pamiętać, że w pliku *.html może się znajdować tylko jeden nagłówek dokumentu. Zatem ikonę dodajemy wewnątrz istniejącego elementu, a nie wstawiamy nowego!
Widżety HTML / ĆwiczeniaOtwórz w edytorze HTML stronę (plik index.html) stworzoną w ramach ćwiczeń z poprzedniego rozdziału. Znajdź w serwisie YouTube przynajmniej jeden ciekawy film powiązany tematycznie z Twoją stroną. Użyj funkcji "Udostępnij / Umieść", aby skopiować kod HTML widżetu z wybranym filmem. Wstaw film bezpośrednio w treści swojej strony. Otwórz Twoją stronę w przeglądarce i sprawdź, czy można uruchomić odtwarzanie filmu.
- Tekst HTML / Blok <div>
<div>...</div> wyświetlanie: w bloku Polecenie to wydziela większy blok tekstu. W odróżnieniu od akapitu, blok może zawierać wewnątrz siebie inne elementy wyświetlane w bloku. Kolejne bloki są oddzielane od siebie znakami nowej linii, ale nie są dodawane linijki przerwy (aby je dodać, należy zastosować znacznik <p>...</p> albo <br>). Przykład <div> To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy...