Przeskocz do treści

Lekcja 34 (CSS)

Układ kolumnowy strony www.

Projekt_CSS_klasa2ti

Zapoznaj się z treścią artykułu.

Zadanie 1: Przygotuj dokument cw1.html z zewnętrznym arkuszem styl1.css składający się z dwóch bloków ułożonych jeden pod drugim. Następnie korzystając ze znajomości składni CSS dodaj formatowanie:

BLOK 1: 
margines wewnętrzny 20px
kolor tła #ffffcc
czcionka Courgette (google fonts)
rozmiar 1.2 em
tekst wyjustowany (pobierz z serwisu Lorem Ipsum)
liczba kolumn 3

BLOK 2
margines wewnętrzny 8px
czcionka Amaranth (google fonts)
rozmiar 1 em
tekst wyjustowany (pobierz z serwisu Lorem Ipsum)
liczba kolumn 4
szerokość kolumny 100px
odległość między kolumnami 30px
linia oddzielająca kolumny kropkowana czerwona

Zadanie 2:  Przygotuj dokument cw2.html z zewnętrznym  arkuszem styl2.css składający się z trzech bloków ułożonych obok siebie. Następnie korzystając ze znajomości składni CSS dodaj formatowanie:

BLOK 1:
szerokość bloku 40% okna przeglądarki
minimalna szerokość bloku 200px
liczba kolumn 2
linia oddzielająca kolumny ciągła / szerokość 2px
kolor obramowania czerwony / szerokość 1px
tekst wyjustowany (pobierz z serwisu Lorem Ipsum)
BLOK 2:
szerokość bloku 50% okna przeglądarki
minimalna szerokość bloku 300px
liczba kolumn 3
odstęp między kolumnami 50px
tekst wyjustowany (pobierz z serwisu Lorem Ipsum)
kolor tła żółty

BLOK 3:
jedna kolumna
kolor tła czarny
kolor liter biały
minimalna szerokość bloku 100px
error: Content is protected !!