LBweb Łukasz Bącik
Komentarze: 0

Bootstrap 4 – wstęp do nowości

Każdy, kto choć troche interesuje się tworzeniem stron internetowych na pewno zna framework frontendowy Bootstrap. Jest to jeden z najbardziej popularnych i najczęściej wykorzystywanych narzędzi deweloperskich do tworzenia stron. Właśnie została zaprezentowana jego czwarta wersja, póki co w stadium alpha. Jest sporo nowości, a więc zaczynamy.

Każdy, kto choć trochę interesuje się tworzeniem stron internetowych na pewno zna framework frontendowy Bootstrap. Jest to jeden z najbardziej popularnych i najczęściej wykorzystywanych narzędzi deweloperskich do tworzenia stron. Właśnie została zaprezentowana jego czwarta wersja, póki co w stadium alpha. Jest sporo nowości, a więc zaczynamy.

Bootstrap 4 - wstęp do nowości

Brak wsparcia dla IE8 – nareszcie!

Według serwisu StatCounter z przeglądarki Internet Explorer w wersji 8 korzysta około 2,5% internautów. To w zupełności wystarczy, aby zaprzestać wsparcia i dalszego rozwodzenia się na ten temat.

Od LESS do SASS

W celu usprawnienia pracy nad warstwą frontową witryny wykorzystuje się tzw. prepoprocesory css. Do najpopularniejszych należą Less i Sass. Dotychczas Bootstrap wykorzystywał tę pierwszą, czyli Less, jednak przyszedł czas na rozwiązanie bardziej rozwojowe, czyli Sass. W tej kompilacji m.in. gradienty zostały przeniesione do oddzielnego pliku, co ładnie porządkuje kod. To się ceni.

System siatki gridowej

Tutaj również wprowadzono zmiany. Wg mnie najciekawszą zmianą w media-queries jest operowanie na systemie wielkości „em”, zamiast „px”. Przeliczenie em do px to: 1em = 15px. Progi jakie zastosowano to:

  • Extra small (col-xs-) – szerokość mniejsza niż 34em,
  • Small (col-sm-) – szerokość większa niż 34em,
  • Medium (col-md-) – szerokość większa od 48em,
  • Large (col-lg-) – szerokość ponad 62em,
  • Extra large (col-xl) – szerokość większa niż 75em.

Co dalej z glyphicons?

Bootstrap 3 zawiera wiele przykładów ikonek, które mogą być wykorzystywane do różnych celów. W przypadku bieżącej wersji alpha nie zostały one uwzględnione. Czy będą, nie wiadomo. Nawet gdyby się zdarzyło, że ikonek nie ma, są alternatywy tj. font-awesome, których jest o wiele więcej.

Przykład

Krótko i na temat.

Podsumowując

Uważam, że zmiany idą w bardzo dobrym kierunku ze względu na przesiadkę na Sass oraz zaprzestanie wsparcia dla IE8. Niewątpliwie przełoży się to na porządek w kodzie, ale także wydajność na mobile.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *