Samouczek HTML

Strona główna HTML Wprowadzenie do HTML Edytory HTML Podstawy HTML Elementy HTML Atrybuty HTML Nagłówki HTML Akapity HTML Style HTML Formatowanie HTML Cytaty HTML Komentarze HTML Kolory HTML HTML CSS Linki HTML Obrazy HTML Ulubione HTML Tabele HTML Listy HTML Blok HTML i wbudowany Klasy HTML Identyfikator HTML Ramki HTML HTML JavaScript Ścieżki plików HTML Nagłówek HTML Układ HTML HTML Responsywne Kod komputerowy HTML Semantyka HTML Przewodnik po stylach HTML Jednostki HTML Symbole HTML Emotikony HTML Zestaw znaków HTML Kodowanie adresu URL HTML HTML a XHTML

Formularze HTML

Formularze HTML Atrybuty formularza HTML Elementy formularza HTML Typy danych wejściowych HTML Atrybuty wejściowe HTML Atrybuty formularza wejściowego HTML

Grafika HTML

Płótno HTML HTML SVG

Media HTML

Media HTML Wideo HTML Dźwięk HTML Wtyczki HTML HTML YouTube

API HTML

Geolokalizacja HTML Przeciągnij/upuść HTML Magazyn sieciowy HTML HTML Web Workers HTML SSE

Przykłady HTML

Przykłady HTML Quiz HTML Ćwiczenia HTML Certyfikat HTML Podsumowanie HTML Dostępność HTML

Odniesienia HTML

Lista znaczników HTML Atrybuty HTML Globalne atrybuty HTML Obsługa przeglądarki HTML Zdarzenia HTML Kolory HTML Płótno HTML HTML audio/wideo Dokumenty HTML Zestawy znaków HTML Kodowanie adresu URL HTML Kody językowe HTML Wiadomości HTTP Metody HTTP Konwerter PX na EM Skróty klawiszowe

Podstawowe przykłady HTML


W tym rozdziale pokażemy kilka podstawowych przykładów HTML.

Nie martw się, jeśli używamy tagów, o których jeszcze nie wiesz.


Dokumenty HTML

Wszystkie dokumenty HTML muszą zaczynać się od deklaracji typu dokumentu: <!DOCTYPE html>.

Sam dokument HTML zaczyna się <html>i kończy na </html>.

Widoczna część dokumentu HTML znajduje się pomiędzy <body>i </body>.

Przykład

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

Deklaracja <!DOCTYPE>

Deklaracja <!DOCTYPE>reprezentuje typ dokumentu i pomaga przeglądarkom w prawidłowym wyświetlaniu stron internetowych.

Musi pojawić się tylko raz, u góry strony (przed tagami HTML).

W <!DOCTYPE>deklaracji nie jest rozróżniana wielkość liter.

Deklaracja <!DOCTYPE>dla HTML5 to:

<!DOCTYPE html>

Nagłówki HTML

Nagłówki HTML są definiowane za pomocą znaczników <h1>to .<h6>

<h1>definiuje najważniejszy nagłówek. <h6>definiuje najmniej ważny nagłówek: 

Przykład

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>


Akapity HTML

Paragrafy HTML są definiowane za pomocą <p>tagu:

Przykład

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

Linki HTML

Linki HTML są definiowane za pomocą <a>tagu:

Przykład

<a href="https://www.w3schools.com">This is a link</a>

Miejsce docelowe łącza jest określone w hrefatrybucie. 

Atrybuty służą do dostarczania dodatkowych informacji o elementach HTML.

Więcej o atrybutach dowiesz się w kolejnym rozdziale.


Obrazy HTML

Obrazy HTML są definiowane za pomocą <img>tagu.

Plik źródłowy ( src), tekst alternatywny ( alt), widthi heightsą dostarczane jako atrybuty:

Przykład

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">

Jak wyświetlić źródło HTML?

Czy kiedykolwiek widziałeś stronę internetową i zastanawiałeś się "Hej! Jak oni to zrobili?"

Wyświetl kod źródłowy HTML:

Kliknij prawym przyciskiem myszy stronę HTML i wybierz „Wyświetl źródło strony” (w Chrome) lub „Wyświetl źródło” (w Edge) lub podobnie w innych przeglądarkach. Otworzy się okno zawierające kod źródłowy HTML strony.

Sprawdź element HTML:

Kliknij prawym przyciskiem myszy element (lub pusty obszar) i wybierz „Sprawdź” lub „Sprawdź element”, aby zobaczyć, z czego składają się elementy (zobaczysz zarówno kod HTML, jak i CSS). Możesz także edytować kod HTML lub CSS w locie w panelu Elementy lub Style, który się otworzy.