11 – Ćwiczenie podsumowujące – podstawowa struktra strony oraz tekst

Ćwiczenie 1 — Podstawowa struktura strony

Napisz kod strony WWW zgodnie z zasadami poprawnej struktury HTML. Strona powinna spełniać następujące wymagania:

Wymagania:

  1. Ustaw:

    • język strony na polski

    • kodowanie polskich znaków

    • tytuł strony: Kartkówka 1

    • autora: Twoje imię i nazwisko

  2. W treści zastosuj odpowiednie nagłówki:

    • h1 → tekst: Kartkówka – Podstawowa struktura. Tekst

    • h2 → tytuł piosenki: Co mi, Panie, dasz

    • h3 → tekst: T19, kl.1 TP, TSI oraz tytuły zadań

    • h4 → podpis na dole strony

  3. Zastosuj formatowanie HTML:

    • indeks górny

    • wyróżnienie fragmentu tła (np. <mark>)

    • pogrubienia, kursywy — w miejscach widocznych w treści

  4. Dodaj akapity, w których zastosujesz kolor czcionki: #7f8faf

 

Ćwiczenie 2 — Strona ze stylami CSS

Utwórz stronę HTML, do której podłączysz zewnętrzny plik stylów styl.css.

W treści strony umieść tekst zgodnie z układem:

„Czułem powołanie w życiu swym na księdza;
Albo też żołnierski włożyć but.
– Lecz poznałem, że mi tamten ani ten
Już nie mają czego bronić.”

Wymagania dotyczące stylów (styl.css):

  1. Tło strony: #d4e2ef

  2. Czcionka całej strony: Tahoma

  3. Nagłówki:

    • h2 i h3: kolor tekstu #2335a1, podkreślenie lub przekreślenie (CSS)

  4. Nagłówek h1:

    • tło: #cad8f3

    • tekst: biały

    • wielkość: 2.5em

    • litery rozstrzelone na 10px

    • tekst kapitalikami (uppercase)

    • cień liter w kolorze #286250

    • wyśrodkowanie (text-align: center)

  5. W treści:

    • akapity z kolorem czcionki #7f8faf

    • fragment tekstu „W ten niepewny czas?” → tło #9d4bcf, tekst biały

 

Ćwiczenie 3 — Układ znaków HTML

Na stronie utwórz układ tekstu jak poniżej:

@@@@@@@@@@@@@
*****
@@@@@@@@@@@@@
^^^^^

Wymagania:

  1. Użyj odpowiedniego wyrównania (np. text-align: center, margin, pre, lub white-space: pre; w CSS).

  2. Odwzoruj odstępy i ułożenie symboli jak najbardziej zbliżone do oryginału.

  3. Pod spodem umieść podpis autora w postaci nagłówka h4:
    autor: imię i nazwisko

 

Zrzut-ekranu-2025-12-10-o-08.57.52 11 - Ćwiczenie podsumowujące - podstawowa struktra strony oraz tekst