Курс Bootstrap – базовый уровень 1

Tytuł - Kurs Bootstrap - podstawy poziom 1

Poziom: podstawy

Czas trwania - 4 godziny 12 minut

Podczas trwania kursu nauczysz się pracy z  najbardziej znaną biblioteką CSS czyli Bootstrap w wersji 4. Zaczniesz od podłączenia jej do istniejącej strony. Nauczysz się stosować podstawowe klasy, które na stronie będą odpowiedzialne za typografię oraz jej wyrównanie i formatowanie. Poznasz pracę z kolorem, tworzenie obramowania, ustawienia marginesów czy formatowanie zdjęć i grafik. Zobaczysz jak tworzyć responsywne szablony za pomocą kontenerów, wierszów i kolumn. Pokażemy Ci jak dostosować kolumny wraz ze zmieniającą się szerokością ekranu. Zobaczysz również jak korzystać z Flexbox przy układaniu i wyrównywaniu elementów oraz poznasz jego inne ciekawe zastosowania. Nie zabraknie również informacji o tworzeniu przycisków, menu okruszkowego czyli tzw. breadcrumb, paska postępu i wielu innych rzeczy, które znajdziesz na każdej stronie internetowej.

• tworzenia nowoczesnych stron internetowych

• tworzenia interaktywnych elementów

• stosowania i formatowania typografii

• posługiwania się kolorem

• tworzenia obramowania

• tworzenia marginesów, odnośników

• dowiesz się co to jest breakpoint

• tworzenia grida czyli wiersze i kolumny

• dostosowania strony do zmieniającej się szerokości ekranu

• wyrównywania elementów

• posługiwania się Flexboxem

• stylowania przycisków

• tworzenia menu okruszkowego

Co to jest Bootstrap?

Bootstrap 3 to przydatna biblioteka stylów oraz skryptów umożliwiająca szybkie konstruowanie stron internetowych.

Biblioteka ta ułatwia tworzenie estetycznie wyglądających układów stron i zapewnia spójny wygląd wszystkich elementów, takich jak przyciski, fonty czy tabele. Ponadto każda strona stworzona za pomocą Bootstrapa jest responsywna, czyli wyświetla się poprawnie na smartfonach, tabletach i komputerach stacjonarnych. Jeżeli zajmujesz się projektowaniem stron internetowych, to poznanie Bootstrapa znacząco zwiększy Twoją wydajność i jakość pracy przy projektowaniu stron.

Kurs poziom 1 w Bootstrapie przedstawia najczęściej wykorzystywane elementy Bootstrapa, które są kluczowe, by poznać tą bibliotekę od podstaw.

Twórz nowoczesne strony

Budowanie elastycznych stron internetowych jest kluczem nowoczesnego projektowania. Liczba osób, przeglądających strony na smartfonach i tabletach jest ogromna. Jako projektant musisz zadbać o to, by Twoja witryna była responsywna. Pomoże Ci w tym Bootstrap. Dzięki niemu Twoja stronaa będzie reagować na zmiany rozdzielczości urządzenia, na którym jest oglądana. Używanie tego frameworka jest niezwykle wydajne ponieważ znajdziesz do niego tysiące gotowych stylów i funkcji, gotowych do wdrożenia zaraz po instalacji.

Szybkie projektowanie

HTML i CSS są podstawowym budulcem stron www. Jednak musisz wiedzieć, że możesz znacznie skrócić czas budowy strony w oparciu o te dwie technologie. Wystarczy skorzystać z Bootstrapa, na którym obecnie opiera się miliony stron na całym świecie. Dzięki prostocie i łatwości korzystania, framework ten zdobył tak wielu zwolenników. Cały proces budowy strony można przyrównać do zasady przeciągnij i upuść.

1. Wprowadzenie

1.1. Wstęp

1.2. Podłączenie Bootstrapa do strony

2. Podstawowe klasy

2.1. Typografia – podstawowe informacje

2.2. Wyrównywanie tekstu

2.3. Formatowanie list

2.4. Formatowanie cytatów

2.5. Pozostałe elementy tekstowe

2.6. Kolory

2.7. Zmiana koloru odnośników

2.8. Tworzenie obramowania

2.9. Kolor obramowania i zaokrąglanie

2.10. Marginesy

2.11. Formatowanie obrazków

2.12. Inne ciekawe klasy dla obrazków

3. Nowoczesny layout strony

3.1. Breakpoint – istota koncepcji

3.2. Kontenery

3.3. Grid – wiersze i kolumny

3.4. Kombinacje kolumn a szerokość ekranu

3.5. Przesuwanie kolumn

3.6. Zagnieżdżanie

3.7. Zmiana kolejności kolumn

4. Umieszczanie i wyrównywanie elementów na stronie

4.1. Wyrównywanie elementów w pionie

4.2. Wyrównywanie elementów w poziomie

4.3. Pozycjonowanie typu fixed

4.4. Sposoby wyświetlania elementów

4.5. Układanie elementów za pomocą Flexbox

4.6. Inne ciekawe możliwości Flexbox

4.7. Widoczność i rozmiary

5. Style interfejsu użytkownika

5.1. Etykiety

5.2. Przyciski

5.3. Grupa przycisków

5.4. List group

5.5. Breadcrumb

5.6. Pasek postępu

6. Zakończenie

6.1. Pożegnanie

Sposób wyboru wersji kursu:

Kurs wideo dostępny jest w dwóch formach, w zależności jaką wysyłkę wybierzesz:

1. elektronicznej - jako link do pobrania spakowanego archiwum. Otrzymasz po zakupie link na maila. W tym wypadku wybierz z opcji wysyłki - elektroniczna 0 zł.

2. pudełkowej na DVD - zamiast linku do pobrania otrzymasz pod wskazany adres płytę DVD. W tym wypadku wybierz opcję wysyłki paczkomaty lub kuriera.

Czy kurs będzie pasował do programu, który posiadam ?

Kursy tworzone są na różnych wersjach programu. Jednak w większości przypadków pasują do każdej wersji. Kursy tworzone są w taki sposób, by pasowały i były neutralne na starszych wersjach oprogramowania. Czyli jeśli posiadasz np. Photoshopa z roku 2019, a kurs jest tworzony na wersji Photoshopa 2020, będzie on pasował w 100%.

Czy z kursem otrzymam program?

Kursy to filmiki wideo pokazujące pracę w danym programie. Do żadnego z kursów nie jest dołączony program, w który należy zaopatrzyć się we własnym zakresie.