przykład - Kurs HTML i CSS
- Tabele HTML / Łączenie wierszy tabeli w grupy <thead, tbody, tfoot>
Spis treści <thead, tbody, tfoot> Łączenie wierszy tabeli w grupy <tbody> Nagłówek i stopka <thead, tfoot> Łączenie wierszy tabeli w grupy <tbody> <table> <tbody> <tr>...</tr> </tbody> </table> Łączenie wierszy w grupy umożliwia później odnoszenie się do takiej grupy jako do całości. Dzięki temu możemy nadać od razu całej grupie np. określone formatowanie za pomocą CSS. W grupę można połączyć dowolną liczbę wierszy. W jednej tabeli może istnieć kilka grup. Jeżeli umieścimy w...
- Tabele HTML / Łączenie kolumn tabeli w grupy <colgroup, col>
Spis treści <colgroup, col> Grupa kolumn <colgroup> Kolumna <colgroup, col> Grupa kolumn <colgroup> <table> <colgroup span="x"></colgroup> <tr>...</tr> </table> gdzie "x" oznacza ilość kolumn do połączenia w grupę. Jeśli całkowicie pominiemy atrybut span="...", przyjmie on domyślną wartość "1". Łączenie kolumn w grupy umożliwia później odnoszenie się do takiej grupy jako do całości. Dzięki temu możemy nadać od razu całej grupie np. określone formatowanie za pomocą CSS. W grupę...
- Multimedia HTML / Obrazek HTML <img>
...Shop, Ulead GIFAnimator czy GIMP i inne. Jest to po prostu specjalny plik GIF, który wstawiamy na stronę, tak jak zwykły obrazek. Może on mieć przykładowo rozmiary 400x50. Pamiętaj, że im więcej klatek animacji, tym większe rozmiary pliku i dłuższe wczytywanie strony!
- Widżety HTML / Ramki lokalne <iframe>
...ramkę lokalną (ang. inline frame), która działa jak niezależne okno przeglądarki wewnątrz strony internetowej. Jak wstawić IFRAME na HTML? Na przykład jeśli plik podstrony nazywa się "podstorna.html" i znajduje się w tym samym katalogu na dysku komputera co dokument *.html, w którym chcemy wstawić ramkę IFRAME, można się posłużyć następującym znacznikiem: <iframe src="podstrona.html"></iframe>. Jaki znacznik HTML służy do wyświetlania w ramce fragmentu innej strony internetowej na...
- Widżety HTML / Wczytywanie strony do ramki lokalnej <a target>
...się w miejsce pliku "ramka1.html"</a> <a href="...">Ten link załaduje się w miejsce pliku "ramka2.html"</a> Przykład <a target> Zobacz powyższy przykład Wczytanie stron do dwóch ramek Jak łatwo zauważyć, za pomocą pojedynczego odsyłacza można wczytać nową stronę tylko do jednej ramki jednocześnie. Jeśli chcielibyśmy aby po kliknięciu odnośnika zmieniła się zawartość dwóch (lub więcej) ramek, można w tym celu użyć JavaScriptu: <a href="javascript:void(0)...
- HTML5 / Nawigacja <nav>
...przedzierania się przez mniej istotne treści, które w kodzie źródłowym dokumentu znajdują się przed nim. Przykład <nav> Poniżej przedstawiony przykład zawiera dwie sekcje nawigacyjne: pierwsza dla całego serwisu, a druga w obrębie artykułu na stronie. <nav> <ul> <li><a href="index.html">Strona główna</a></li> <li><a href="contents.html">Spis treści</a></li> </ul> </nav> <article> <h1>Mój artykuł</h1> <nav> <ul> <li><a href="#sec1">Rozdział 1</a></li> <li><a...
- XHTML / Różnice między HTML 4 a XHTML 1.0
...W przypadku konfliktów ważniejsza będzie wartość id. Wartości atrybutów domyślnych są zawsze definiowane małymi literami. Na przykład jeśli nie podamy jawnie atrybutu type dla znacznika input, zostanie dla niego przyjęta wartość type="text", a nie type="TEXT". Znaki specjalne (tzw. encje) w języku HTML można zapisywać używając wartości szesnastkowych (HEX), np.: &#Xnn; lub &#xnn;, gdzie "nn" to liczba szesnastkowa. XHTML pozwala tylko na drugą wersję, tzn. &#xnn...
- HTML5 / Uwydatnienie <mark>
...możemy przekazać użytkownikowi, że taki fragment może być dla niego szczególnie przydatny, biorąc pod uwagę czynności, które właśnie podjął. Na przykład jeżeli użytkownik właśnie użył wyszukiwarki w serwisie, w wynikach wyszukiwania możemy uwydatnić słowa, których szukał. Należy wyraźnie odróżnić znaczenie uwydatnienia realizowanego przez znacznik MARK od EM i STRONG. Element MARK uwydatnia tekst tylko w określonym kontekście (w innym może już nie być zaznaczony). Natomiast znacznik EM...
- HTML5 / Autouzupełnianie <datalist>
...<option value="wartość1" label="skrót1"> <option value="wartość2" label="skrót2"> </select> </datalist> Przykład <datalist> Zobacz przykład: DATALIST
- HTML5 / Pasek postępu <progress>
...specjalny animowany pasek postępu, którego pozycja będzie np. przechodzić w kółko z jego lewej na prawą stronę. Przykład <progress> Zobacz przykład: PROGRESS
