HTML (HyperText Markup Language) – to język znaczników, który jest używany do tworzenia stron internetowych. Określa strukturę dokumentu za pomocą znaczników.
Podstawy HTML
Dokument HTML składa się z elementów, które są otoczone znacznikami. Na przykład:
<!DOCTYPE html>
<html>
<head>
<title>Moja pierwsza strona</title>
</head>
<body>
<h1>Cześć, świecie!</h1>
<p>To mój pierwszy dokument HTML.</p>
</body>
</html>
Podstawowe znaczniki HTML
Nagłówki
Aby tworzyć nagłówki, używa się znaczników <h1> – <h6>:
<h1>To nagłówek poziomu 1</h1>
<h2>To nagłówek poziomu 2</h2>
Akapity
Znacznik <p> jest używany do akapitów tekstowych:
<p>To zwykły akapit tekstowy.</p>
Linki
Aby tworzyć hiperlinki, używa się znacznika <a>:
<a href="https://example.com">Przejdź do strony</a>
Obrazy
Aby wstawić obraz, używa się znacznika <img>:
<img src="image.jpg" alt="Opis obrazu">
Listy
Listy mogą być numerowane (<ol>) i nienumerowane (<ul>):
<ul>
<li>Pierwszy punkt</li>
<li>Drugi punkt</li>
</ul>
<ol>
<li>Pierwszy punkt</li>
<li>Drugi punkt</li>
</ol>
HTML jest podstawą każdej strony internetowej. Określa jej strukturę, a style i skrypty pomagają uczynić stronę funkcjonalną. Jeśli dopiero zaczynasz przygodę z tworzeniem stron internetowych, HTML to pierwszy krok. Najlepiej - praktyka.
Jak stworzyć pierwszą stronę internetową (offline)
Aby stworzyć prostą stronę HTML i wyświetlić ją w przeglądarce, wykonaj następujące kroki:
- Otwórz dowolny edytor tekstu (na przykład Notepad, VS Code, Sublime Text).
- Utwórz nowy plik i wklej do niego następujący kod:
<!DOCTYPE html>
<html>
<head>
<title>Strona offline</title>
</head>
<body>
<h1>To moja strona offline</h1>
<p>Ten tekst wyświetla się w twojej przeglądarce bez internetu. Przeglądarka odczytuje i interpretuje kod z twojego pliku.</p>
</body>
</html>
- Zapisz plik z rozszerzeniem
.html, na przykładindex.html. - Otwórz folder, w którym zapisano plik, i dwukrotnie kliknij na niego. Otworzy się w twojej przeglądarce.
Jeśli zrobiłeś wszystko poprawnie - zobaczysz zawartość swojego pliku w przeglądarce.
Dokładniej mówiąc - zinterpretowaną zawartość. Nie zobaczysz znaczników, zobaczysz to, w co są one interpretowane.
Na przykład, nie zobaczysz tego znacznika na stronie:
<title>Strona offline</title>
Jej zawartość będzie widoczna na pasku przeglądarki (nazwa karty lub okna).