Start•LEKCJA 02 / 22

Jak działa HTML w przeglądarce

Kurs HTML · Wyjaśnienie, przykłady, oczekiwany wynik i ćwiczenie.

HTML opisuje strukturę strony, a nie sam jej wygląd.

Cel lekcji

Poznać zagadnienie „Jak działa HTML w przeglądarce”, zrozumieć przykład i umieć zastosować podobny zapis we własnym programie.

Wyjaśnienie krok po kroku

Przeglądarka interpretuje znaczniki i tworzy dokument. CSS odpowiada za styl, a JavaScript za interakcję.

Najpierw przeanalizuj kod bez uruchamiania. Zwróć uwagę, jakie dane wykorzystuje program, co z nimi robi i skąd bierze się wynik pokazany pod przykładem.

Praktyczny przykład

Gdzie zobaczysz efekt: Widok w przeglądarce

<!doctype html>
<html lang="pl"><body>
  <p>To moja strona</p>
</body></html>

Przeczytaj kod linijka po linijce

  1. <!doctype html>Przygotowujemy środowisko i deklarujemy element potrzebny programowi.
  2. <html lang="pl"><body>Tworzymy nagłówek porządkujący treść strony.
  3. <p>To moja strona</p>Dodajemy akapit, który użytkownik przeczyta na stronie.
Oczekiwany wynik / efektpo uruchomieniu przykładu
Na stronie widoczny jest akapit: „To moja strona”.
◉Podgląd w przeglądarceHTML/CSS — bez uruchamiania skryptów

Jak utrwalić tę umiejętność?

Przepisz kod samodzielnie. Następnie zmień jedną wartość lub jedną instrukcję i spróbuj przewidzieć efekt. Dopiero potem uruchom zmienioną wersję. Jeśli wynik jest inny niż oczekiwany, porównaj kolejne linie.

Spróbuj samodzielnie

Dodaj drugi akapit z własnym tekstem.

To już koniec tej lekcji.

Jeśli rozumiesz przykład, oznacz lekcję jako ukończoną i przejdź dalej.