Inf. dla klas drugich - L. 35

Temat: warstwy w HTML
Warstwy w HTML tworzone są za pomocą znaczników <div></div>

Żeby użyć style do warstwy, należy opisać je w następujący sposób:

<div style="parametr: wartość; parametr: wartość...">
</div>

Style dla warstw:

• Padding (lub padding-left, padding-top, padding-right, padding-bottom) - wewnętrzne odstępy (odstępy w środku warstwy), np.:
• 20px
• Margin (lub margin-left, margin-top, margin-right, margin-bottom) - zewnętrzne odstępy (odstępy naokoło warstwy), np.:
• 30px
• auto
• Background-color - kolor tła, np.:
• red
• blue
• yellow
• white
• green
• orange
• rgb(0,100,255) - kolor w systemie RGB (czerwony, zielony, niebieski), każdy składnik koloru może mieć wartość od 0 do 255
• Width - szerokość, np.:
• 300px
• 100%
• Height - wysokość, np.:
• auto
• 250px
• Text-align - sposób wyrównania tekstu wewnątrz warstwy, np.:
• right
• left
• center
• justify - wyjustowany
• Float - sposób wyrównania warstw, np.:
• right
• left

Zadanie: Używając edytora HTML http://htmledit.squarefree.com/, stwórz warstwy jak na powyższym rysunku. Szczegóły:

1. Warstwa czerwona zawiera warstwy żółtą i zieloną i ma następujące style:
1. wysokość automatyczną
2. szerokość 190 pikseli
3. wewnętrzne odstępy 10 pikseli
4. wyrównana do lewej strony
2. Warstwa żółta ma następujące parametry
1. Szerokość 150 pikseli
2. Wysokość 100 pikseli
3. Wewnętrzne odstępy 20 pikseli
4. Wyrównanie tekstu do środka
3. Warstwa zielona ma następujące parametry
1. Szerokość 150 pikseli
2. Wysokość 100 pikseli
3. Wewnętrzne odstępy 20 pikseli
4. Wyrównanie tekstu do środka
5. Odstęp z góry 20 pikseli (użyj  margin-top)
4. Warstwa niebieska zawiera warstwy pomarańczową i białą i ma następujące style:
1. wysokość automatyczną
2. szerokość 390 pikseli
3. wewnętrzne odstępy 10 pikseli
4. wyrównana do prawej strony
5. Warstwa pomarańczowa ma następujące parametry
1. Szerokość 250 pikseli
2. Wysokość 50 pikseli
3. Wewnętrzne odstępy 20 pikseli
4. Wyrównanie tekstu do środka
5. Odstępy naokoło automatyczne
6. Warstwa biała ma następujące parametry
1. Szerokość 350 pikseli
2. Wysokość 50 pikseli
3. Wewnętrzne odstępy 20 pikseli
4. Wyrównanie tekstu do środka
5. Odstęp z góry 70 pikseli