Ludzie traktują Frontend development jak jakąś mityczną bestię, którą tylko nieliczni potrafią oswoić. Ale prawda jest taka, że to nie jest takie trudne.
Jak mówi słynne powiedzenie: Mistrz to nie ktoś, kto ćwiczył 10 000 różnych ruchów, to ktoś, kto ćwiczył 1 ruch 10 000 razy.
Wystarczy, że opanujesz kilka podstawowych umiejętności CSS, a w krótkim czasie staniesz się Frontend Wizardem.
Układ przy użyciu Flexbox i Grid
Flexbox i Grid są dwoma z najbardziej efektywnych narzędzi CSS, których możesz użyć do tworzenia układów, ale na początku mogą być nieco przytłaczające. Ale kiedy już to opanujesz, staną się twoimi ulubionymi narzędziami.
Ukierunkowanie na różne urządzenia
Nigdy nie wiesz, z jakiego urządzenia będą korzystać Twoi użytkownicy, aby wejść na Twoją stronę. Dlatego tak ważne jest, aby upewnić się, że Twoja strona wygląda responsywnie na urządzeniach każdego kształtu i rozmiaru.
Media Queries rozwiązuje ten problem, pozwalając programiście na określenie stylów dla każdego rozmiaru ekranu.
Wykorzystanie pseudoklas i pseudoelementów
Pseudoklasy i pseudoelementy są selektorami CSS, które pozwalają na wybieranie elementów, gdy spełnione są pewne warunki lub określone części elementu.
Mogą one być wykorzystane do dodania interaktywności (uaktualnienie stylu przycisku po najechaniu lub naciśnięciu) i życia (dodanie cytatów lub zmiana stylu pierwszej litery akapitu) do twojej strony.
Tworzenie atrakcyjnych animacji
Chcesz, aby Twoja strona się wyróżniała? Animacje są świetnym narzędziem do osiągnięcia właśnie tego!
Może to być tak proste jak dodanie właściwości transition do elementu używanego w połączeniu z pseudoklasami lub coś bardziej złożonego jak stworzenie własnej animacji przy użyciu klatek kluczowych.
Dołącz do Ciemnej Strony, dodając Cienie
Cień to świetny sposób na dodanie głębi do Twojej strony internetowej. CSS pozwala na dodawanie różnych typów cieni, a mianowicie box-shadow, text-shadow i drop-shadow. Wiedząc, kiedy go używać, przejdziesz długą drogę.
UWAGA: Cienie nie muszą być koniecznie ciemne.
Pozycja elementów
Sposób pozycjonowania elementów jest kluczowy dla rozwoju frontendu, gdy już pokonasz etap początkujący. Nie wiedząc, jak pozycjonowane są elementy statyczne, względne, bezwzględne, stałe i przyklejone, możesz w końcu drastycznie się ograniczyć.
Wygładzanie poszarpanych krawędzi
Właściwość border-radius pozwala deweloperowi stworzyć wypolerowany UI. Jest to świetne narzędzie do kieszeni w swoim arsenale, jeśli masz na celu opracowanie wysoce profesjonalnego UX.
Oryginalny artykuł: https://dev.to/ruppysuppy/mastering-these-7-basics-css-skills-will-make-you-a-frontend-wizard-2khn
IT-Leaders.pl to pierwszy w Polsce ekosystem rekrutacyjny, łącząca Specjalistów IT z pracodawcami. Anonimowy, techniczny profil i konkretnie określone oczekiwania finansowe to tylko niektóre z cech wyróżniających platformę. Zarejestruj się i zobacz jak Cię widzi pracodawca.