Każda strona internetowa opiera się na jakimś kodzie. Bez względu na to czy stworzył ją programista od podstaw decydując się na nieszablonowe rozwiązania, czy do jej powstania został wykorzystany dedykowany motyw i przestrzeń jak np. WordPress, wszystko bazuje na kodzie. Języków programowania mamy wiele, jednak jeżeli tworzymy stronę samodzielnie, nawet przy wykorzystaniu „gotowych” motywów, warto posiadać ogólną wiedzę z zakresu CSS, PHP i HTML, aby móc naprawiać ewentualne niedociągnięcia szablonów, modyfikować gotowe już moduły i stworzyć satysfakcjonujący nas wygląd docelowej strony www.
Czym jest Flex?
Flex to rodzaj struktury, dzięki której możemy bezpośrednio wpłynąć na układ elementów strony i powiedzieć im jak mają się zachowywać w określonych sytuacjach. Kodowanie tą metodą pozwala na kontrolowanie całego layoutu, poszczególnych jego elementów i wpływa na elastyczność obszaru w zależności rodzic – dziecko lub dzieci. Jak sobie to zobrazować? To proste. Załóżmy, że mamy przed sobą obraz z namalowanym w środku kwiatem. Obraz (czyli rama) jest rodzicem, namalowany kwiat – dzieckiem. Za pomocą kodu Flex najpierw mówimy rodzicowi, że ma być elastyczny, co oznacza w praktyce, że dostaje od nas informacje jak postępować z dzieckiem – czyli przykładowym kwiatem. Dzięki kilku parametrom flex, mówimy rodzicowi, w jakim kierunku ułożyć dziecko, czy wyrównać go w prawo, w lewo czy wyśrodkować, co zrobić jeżeli w obrębie rodzica – czyli naszej obrazowej ramce znajdzie się więcej kwiatów – czy mają być położone względem siebie w pionie, w poziomie, jak blisko siebie mają zostać ułożone, czy mogą wystawać za określony obszar, czyli w tym przypadku za ramę zdjęcia.
I podobnie jest ze wszystkimi elementami, z których budujemy stronę internetową. Świadomość tego, który element jest rodzicem, a który dzieckiem, pozwala w odpowiedni sposób wykorzystać kod flex, nadać układom odpowiednich zachowań, a ponadto sprawić że strona internetowa będzie funkcjonować prawidłowo wyświetlając informacje, treści, zdjęcia i inne parametry w sposób czytelny i spójny w zależności od wielkości urządzenia czy ilości informacji jakie chcemy umieścić w obrębie danego elementu.
Oczywiście kodowanie flex css to o wiele więcej parametrów i właściwości. Jeżeli chcesz poznać więcej przykładów i konkretnych kodów, które wykorzystasz przy tworzeniu stron internetowych odwiedź blog Okinet, pod adresem: https://okinet.pl/blog/power-of-flex/.
COMMENTS