Kurs Bootstrap (#2) Belka nawigacyjna (navbar)

Jeżeli masz ochotę zobaczyć więcej naszych filmów, podcastów i artykułów w coraz lepszej jakości, to zachęcamy do pozostawienia subskrypcji, a także do odwiedzenia prowadzonych przez nas witryn oraz do polubienia fanpage'u Pasji informatyki na Facebooku.

Jeśli masz ochotę wesprzeć to co robimy, to możesz:

🕐 TIMESTAMPS (CHWILE CZASOWE):

[ 00:00:12 ] Wstęp do odcinka
[ 00:00:50 ] Komponenty nawigacyjne = navs
[ 00:02:13 ] Belka nawigacyjna = navbar
[ 00:03:13 ] Opis plików projektu, paczka ZIP do pobrania
[ 00:04:07 ] Nawigacja witryny: nav albo div role="navigation"
[ 00:05:13 ] Predefiniowane kolory tła: .bg-*
[ 00:06:14 ] Logo serwisu: .navbar-brand
[ 00:07:24 ] Kolor tekstu: .navbar-light, .navbar-dark
[ 00:10:30 ] Nadanie atrybutu display: .d-*
[ 00:12:55 ] Nadanie odstępów: .m-*, .p-* (margin, padding)
[ 00:15:28 ] Nadanie wyrównania w pionie: .align-*
[ 00:16:43 ] Toggler (przełącznik menu): .navbar-toogler
[ 00:19:10 ] Expand menu na szerokim ekranie: .navbar-expand-*
[ 00:20:47 ] Wyrównianie togglera do lewej strony i brandu do prawej
[ 00:21:58 ] Kolaps menu na wąskim ekranie: navbar-collapse
[ 00:23:33 ] Mechanizm rozwijania menu: atrybut data-toggle
[ 00:25:19 ] Atrybuty ARIA dla menu głównego (poprawa dostępności)
[ 00:31:27 ] Rozwijane submenu: .dropdown, .dropdown-toggle
[ 00:32:50 ] Opcje w submenu: .dropdown-menu, .dropdown-item
[ 00:33:37 ] Mechanizm rozwijania submenu: atrybut data-toggle
[ 00:35:13 ] Atrybuty ARIA dla submenu (poprawa dostępności)
[ 00:37:32 ] Wyróżnienie aktualnej podstrony: .active
[ 00:38:37 ] Wyszarzenie aktualnej podstrony: .disabled
[ 00:39:40 ] Rozwijanie submenu hoverem czy przy kliknięciu?
[ 00:42:55 ] Formularz w navbarze: .form-inline
[ 00:45:28 ] Wyrównanie formularza do prawej strony: .mr-auto
[ 00:46:38 ] Dobranie właściwego rozmiaru ekranu dla expanda
[ 00:47:12 ] Usunięcie buga ze zmienną wysokością navbara
[ 00:48:04 ] Własny kolor tła belki nawigacyjnej
[ 00:48:58 ] Kilka słów końcowych
[ 00:49:40 ] Podsumowanie odcinka na slajdach

💾 POBIERZ PLIKI Z ODCINKA:

🎵 MUZYKA:

VentiCoco - Tranquil

#pasjainformatyki #programowanie #kursbootstrap

[MJ-qknr]

Szkoda, że tak mało osób daje tutaj łapki w górę. Te kursy to jedne z najlepszych kursów programowania jakie można znaleźć w internecie. Pan Mirosław powinien się zastanowić nad tłumaczeniem ich na angielski.

[peol]

W wersji 5 bootstrap mr (margin-right) zamieniono na: me. A data-toggle na: data-bs-toggle. Warto przeczytać dokumentację wersji 5 bo jest kilka istotnych zmian względem poprzedniej wersji.

[pawemazurek]

Pomyślałem sobie, że fajnie by bylo obejrzeć ten kurs jeszcze raz, żeby odświerzyć swoją wiedzę, przy okazji dowiedziałem się, że wyszła beta bootstrapa 5 i coś mnie podkusiło, żeby z niej skorzystać i jak się okazało zmieniło się bardzo dużo. Taką najbardziej rzucającą się w oczy zmianą jest zmienienie nazw stron przy marginesach i paddingach z l i r na s i e. Mimo tego że co chwilę zaglądam na stronę bootstrapa żeby zobaczyć co się zmieniło to kurs wciąż jest super !!!

[marcinmachnik]

dziekuje za wiedze, ktora zdobylem dzieki panu

[mikolajhenzel]

Kocham ten kanał <3 Gdyby nie on, nigdy nie wróciłbym do programowania! Dzięki niemu wracam do kodu, nawet po wielu porażkach

[jannowak]

Dzięki tym tutorialom udało mi się stworzyć całkiem fajne strony i łatwo nauczyć się trudnych rzeczy. Dzięki.

[brus]

Wybitnie, wspaniale, przejrzyście. Creme de la creme dla każdego web developera. Pozdrawiam i bardzo dziękuję Panie Mirosławie. Bóg zapłać.

[piotrkorneluk]

Moj szacunek, świetny odcinek, pełny profesjonalizm. Nareszcie można sie czegoś nauczyć. Pozdrawiam serdecznie. :-) Oczywiście czekam na następne odcinki...

[xMsDanielx]

Myślę, że warto pokazywać jak umiejętnie korzystać z dokumentacji. Pamiętajmy o tym, że nie wszystkie klasy trzeba pamiętać! W dokumentacji wszystko mamy świetnie wytłumaczone.

[lukaszniepala]

Z niecierpliwością czekamy na następny odcinek. Dziekujemy

[Volodymyrvel]

Дякую. Просто про складне. Майстерне викладання, по більше би таких викладачів.

[marcelzme]

Dzięki takim takim ludziom jak Pan, w dni kiedy jest naprawdę ciężko i chciałoby się zrezygnować ze studiowania informatyki, widzę światełko w tunelu.

[Esprit]

Chcemy więcej i częściej. Super poradniki. Czekam na kolejny odc.

[jhonrambo]

Super że idziecie z tym kursem do przodu! Jest świetny, oby tak dalej.

[toErease]

Czekam z niecierpliwoscia na odcinek 3 ! Pozdrawiam

[TS-qfkm]

Super kursy. Bardzo pomocne dla kogoś na początku ścieżki. Dzięki!

[rulff]

Super odcinek, super kurs! Pozdrawiam.

[tense]

*Kiedy kolejny odcinek? Nie mogę się już doczekać :D Chciałbym kontynuować naukę w tym temacie a z twoim dokładnym tłumaczeniem to się wydaje takie proste :D Pozdrawiam i czekam na kolejną część.*

[Szpiedzy]

Mistrzu kiedy kolejny odcineczek Bootsrapa? :D

[kadet]

chciałbym coś z rozwoju osobistego kiedyś, o depresji albo wypaleniu bardzo, imo nie ma dobry materiałów na yt o tych tematach, a Pan by te tematy na pewno fajnie rozpracował jak zawsze przystępnie itd wiadomo, wiem że tego typu komentarzy jest bardzo dużo i to nie jest takie proste ale co tam, napisałem, przynajmniej w statystki pójdzie jak coś :)