Zadanie na rozgrzewkę 2

Stwórz stronę internetową w HTML i CSS o nazwie index.html wraz z arkuszem stylów style.css. Strona powinna zawierać:

1. Tabelę z planem lekcji:

   • 5 kolumn z dniami tygodnia (poniedziałek–piątek).

   • 1 kolumna z godzinami lekcyjnymi (min. 5 godzin).

   • Nagłówki tabeli powinny mieć tło w kolorze rgb(0, 122, 204) i tekst w kolorze rgb(255, 255, 255).

   • Komórki tabeli powinny mieć szerokość 120 px i wysokość 50 px.

   • Tekst w komórkach wyśrodkowany w pionie i poziomie.

   • Obramowania komórek: 1px solid rgb(200, 200, 200).
     
     

2. Formularz kontaktowy:

   • Nagłówek formularza „Kontakt do nauczyciela” czcionką 20 px pogrubioną.
     
     

   • Pola formularza:

     • pole tekstowe na imię i nazwisko,

     • pole e-mail,

     • rozwijana lista wyboru przedmiotu (min. 4 opcje),

     • pole wielowierszowe na wiadomość,

     • przycisk „Wyślij”.
       
       

   • Pola powinny mieć szerokość 100%, wysokość 35 px (textarea: min. 100 px).

   • Kolor tła pól: rgb(245, 245, 245), ramka 1px solid rgb(180, 180, 180).
     
     

   • Przyciski:

     • tło rgb(0, 122, 204),

     • tekst rgb(255, 255, 255),

     • wysokość 40 px, szerokość 100%,

     • po najechaniu kursorem tło zmienia się na rgb(0, 90, 153).
       
       

3. Układ strony:

   • Tabela i formularz mają znajdować się obok siebie na szerokich ekranach.

   • Formularz powinien zajmować 300 px szerokości, tabela resztę miejsca.

   • Całość powinna być wyśrodkowana i mieć odstęp 20 px między elementami.

   • Dla ekranów mniejszych niż 768 px tabela i formularz powinny ustawiać się jeden pod drugim.
     
     

4. Stylizacja ogólna:

   • Tło strony: rgb(244, 244, 249).

   • Czcionka podstawowa: Arial, 16 px, kolor tekstu rgb(51, 51, 51).

   • Nagłówek strony (h1) wyśrodkowany, rozmiar czcionki 26 px, margines dolny 30 px.
     
     

Efekt końcowy:

Rozsuwany przedmiot: