spis treści - Kurs HTML i CSS
Nagłówek i treść HTML / Język strony <html lang, link hreflang>Spis treści <html lang, link hreflang> Język dokumentu <html lang> Inne wersje językowe <link hreflang> Domyślna wersja językowa Język dokumentu <html lang> <html lang="język">...</html> gdzie jako "język" należy podać skrót nazwy wybranego języka. Polecenie to pozwala podać, w jakim języku jest napisana Twoja strona internetowa, np.: pl - polski, en - angielski, de - niemiecki, fr - francuski, it - włoski, es - hiszpański i inne [zobacz: Skróty nazw jezyków]. Nie należy również...
- 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...
- Nagłówek i treść HTML / Nawigacja <link "prev, next, help, search">
Spis treści <link "prev, next, help, search"> Wstęp Sekwencja <link "prev, next"> Pomoc <link "help"> Szukaj <link "search"> Wstęp (interpretuje: Opera 12-) Niektóre przeglądarki pozwalają określić bezpośrednio z poziomu strony WWW dodatkowe punkty nawigacyjne w serwisie. Mogą one być wyświetlane na specjalnym pasku narzędzi (najczęściej Nawigacja) w postaci linków do wskazanych stron. Część z tego typu punktów nawigacyjnych może być również wykorzystywana przez roboty wyszukiwarek...
- Tekst HTML / Tytuł nagłówka <h1, h2, h3, h4, h5, h6>
Spis treści <h1, h2, h3, h4, h5, h6> Tytuł nagłówka <h1, h2, h3, h4, h5, h6> Prawidłowa kolejność tytułów Dymek narzędziowy <h1 title, h2 title, h3 title, h4 title, h5 title, h6 title> Tytuł nagłówka <h1, h2, h3, h4, h5, h6> Tytuł pierwszego poziomu (główny) <h1>...</h1> Tytuł drugiego poziomu (sekcji) <h2>...</h2> Tytuł trzeciego poziomu (podsekcji) <h3>...</h3> Tytuł czwartego poziomu <h4>...</h4> Tytuł piątego poziomu <h5>...</h5> Tytuł szóstego poziomu (najniższej podsekcji)...
Tabele CSS / Rozplanowanie tabeli {table-layout}Spis treści {table-layout} Rozplanowanie tabeli {table-layout} Rozplanowanie automatyczne {table-layout: auto} Rozplanowanie ustalone {table-layout: fixed} Rozplanowanie tabeli {table-layout} selektor { table-layout: rozplanowanie } Selektorem może być element TABLE [zobacz: Wstawianie stylów]. Natomiast jako "rozplanowanie" należy podać: auto - szerokość tabeli zależy od zawartości komórek (domyślnie) fixed - szerokość tabeli nie zależy od zawartości komórek Przy definiowaniu...
- Media CSS / Zapytania mediów
Spis treści Zapytania mediów Kompatybilność wstecz Cechy mediów Szerokość Wysokość Szerokość urządzenia Wysokość urządzenia Orientacja Proporcje obrazu Proporcje obrazu urządzenia Głębia koloru Paleta kolorów Urządzenia monochromatyczne Rozdzielczość Technika wyświetlania Siatka Zapytania mediów (CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome) W dobie rozkwitu różnorakich urządzeń mobilnych, proste przygotowanie osobnych arkuszy CSS dla każdego medium...
- Dobre praktyki / CSS Zorientowane Obiektowo
Spis treści Wstęp Obiekty Atrybuty Kompozycja Rozszerzanie Wielokrotne rozszerzanie Przesłanianie Klasa abstrakcyjna Singleton Polimorfizm Wstęp Każdy programista wie, jaki przełom w rozwoju informatyki przyniosła koncepcja Programowania Zorientowanego Obiektowo (ang. Object Oriented Programming). Dlaczego by nie przenieść tego na grunt CSS? Może zabrzmi to zaskakująco, ale CSS już teraz daje taką możliwość. Nie są wymagane do tego żadne dodatkowe rozszerzenia w przeglądarkach, a...
- Odsyłacze HTML / Do podstrony <a href>
...Aby umożliwić w nich nawigację, wstawia się właśnie takie polecenia, odnoszące się do wszystkich podstron serwisu. Jest to pomocne przy tworzeniu spisu treści, chociaż hiperłącza mogą znajdować się również w zwykłym tekście, odsyłając użytkownika do miejsca, gdzie dany temat jest szerzej opisany. Odsyłacz taki może odnosić się do innej podstrony, ale tylko w obrębie tego samego dysku (ten sam serwis internetowy). Ponieważ sposób przełamywania wierszy w przeglądarce nie zależy od sposobu...
Aktualizacja / Data aktualizacji stronySpis treści Data aktualizacji strony Aktualna data Data aktualizacji strony Często zdarza się, że internauta wchodzący na jakąś stronę, chciałby wiedzieć, kiedy była ona ostatnio aktualizowana. Dzięki takiej informacji mógłby wywnioskować, czy serwis jest aktualizowany na bieżąco i czy nie znajdzie w nim informacji, które dawno utraciły ważność, co w niektórych przypadkach może być bardzo ważne. Najprostszym sposobem określenia aktualności strony, jest podanie w widocznym miejscu (np...
Dla nauczycieli / Scenariusz lekcji informatyki dla liceum i technikumSpis treści Wstęp Cel ogólny cyklu lekcji Wymagania podstawy programowej Lekcja 1 - Struktura dokumentu HTML, podstawowe znaczniki Lekcja 2 - Wstawianie obrazków i podstawowe formatowanie tekstu Lekcja 3 - Listy i tabele w HTML Lekcja 4 - Multimedia w HTML: video, audio, widżety (iframe) Lekcja 5 - Wprowadzenie do CSS: podstawowe style i struktura arkuszy Lekcja 6 - Klasy CSS, ramki, marginesy, tapety, interakcje Lekcja 7 - Publikacja strony internetowej Zadanie końcowe / projekt...