Kolumnowy układ strony
Przed Wami dodaję pierwszą część zadania do rozwiązania, wykorzystującą wiedzę na temat Bootstrapa poznanego przy okazji ostatnich materiałów:
- Utwórz nowy projekt w codesandbox. Następnie dodaj podstawowy szkielet strony html.
- W sekcji
body
dodaj diva z klasą “menu”. Poniżej zamknij diva. - Następnie dodaj kolejnego diva z klasą “header”. Poniżej zamknij diva.
- Kolejnym elementem strony będzie kontent. Stwórz element div z klasą “container”. Pod nim dodaj kolejnego diva z klasą “row”. Wewnątrz niego dodaj dwa takie same divy z klasami “col-xs-12” i “col-md-6”. Pozamykaj wszystkie divy.
- Kolejnym elementem będzie stopka. Utwórz diva z klasą “footer”. Wewnątrz dodaj diva z klasą “row”, a w nim dwa divy z klasą “col-xs-4”, a drugi z klasą “col-xs-8”. Pozamykaj wszystkie divy.
PRZYKŁAD. KLIKNIJ, ABY PODEJRZEĆ…
compassionate-dew-pzz84
compassionate-dew-pzz84 danielminschinski
W kolejnym materiale dodam kontynuacje ćwiczenia. Rozwiniemy menu oraz jumbotron.
Jeżeli chciałbyś/chciałabyś wesprzeć mój blog to zapraszam -> WSPARCIE DLA BLOGA