Cienie pod elementami na stronie internetowej bardzo często poprawiają ich czytelność. Ma to miejsce na przykład podczas użycia wyskakujących okien czy tak zwanych modali. Jeszcze kiedyś chcąc uwydatnić element należało przygotować odpowiednią grafikę i umieścić ją w tle elementu. Dzisiaj mamy ten komfort, że możemy stworzyć cień w CSS i będzie on bardzo realistycz
Conic-gradient() to wbudowana funkcja CSS, za pomocą której można tworzyć ciekawe, barwne tła. Sposobów na wykorzystanie tego typu tła jest oczywiście więcej. Dzisiaj skupię się na omówieniu zasady działania i kilku przykładach.
Tworzenie stron internetowych zawiera w sobie wiele możliwości. Także jeśli chodzi o projektowanie i tworzenie formularzy, w których zawarte są pola wyboru. Jak podejść do tego typu formularzy i jak je wykonać, by były przyjazne użytkownikowi? Wyrównanie checkbox’ów i sposoby przedstawię w poniższym, krótkim artykule.
Zapytania o media przeglądarki są bardzo istotne, gdy tworzymy responsywne strony www. Dzisiaj dobrą praktyką jest projektowanie stron w tak zwanym podejściu „mobile first” oraz elastycznie dopasowane do rodzaju urządzenia i szerokości jego ekranu. Dzisiaj chcę przedstawić czwarty poziom Media Queries, czyli dostosowanie elementów względem wielu parametrów w nowym podejściu (zakresy).
Tworząc i wersjonując projekty czasem potrzebujemy poprowadzić daną gałąź (branch) bez historii branch’a źródłowego. Jest to pomocne w przypadku, gdy chcemy wydzielić jakiś moduł, który następnie przeniesiemy do innego projektu. Zatem przejdźmy do szybkiego przedstawienia operacji tworzenia branch’a bez historii.
Rozszerzenia środowiska IDE są nieocenione w przyspieszaniu pracy bez obniżania jakości. Biorąc pod uwagę, że Visual Studio Code jest jednym z najpopularniejszych narzędzi, postanowiłem przedstawić kilka przydatnych wtyczek. Dotyczyć będą one głównie pracy frontendowej, jednak mimo wszystko warto znać wtyczki do VS Code.
Prezentacja treści na stronie w formie graficznej to bardzo istotne zagadnienie. Chodzi głównie o to, aby obrazy były umieszczone w odpowiednich proporcjach. W tym przypadku z pomocą przychodzi nam aspect ratio w CSS. Jest to rozwiązanie znane już od dawna, jednak nie wszystkie przeglądarki to wspierają. Przejdźmy do konkretów.
Chciałbym wam przedstawić pomysł szybkich kodów do wykorzystania w różnych projektach. Mam nadzieje, że wystarczy mi pomysłów, by wrzucać je regularnie. Zatem zaczynam od pierwszego, stylowego i lekkiego formularza kontaktowego (lub jak ktoś woli rejestracyjnego).
Od jakiegoś czasu można zaobserwować w świecie dev nowy trend lub podejście do tworzenia stron www. Mowa tu o planowanym wprowadzeniu „CSS Container Queries” do obsługi elastycznych layoutów. Tworząc projekt responsywny, często używa się zapytania @media, aby zmienić układ elementów w zależności od rozmiaru widocznego obszaru.
Często przemierzając internet można spotkać strony internetowe typu „one page”. Na niektórych przechodzenie między sekcjami odbywa się na zasadzie przewijania oraz „doskakiwania” do kolejnej/poprzedniej sekcji. Dawniej robiło się to za pomocą JavaScriptu, jednak dzisiaj możliwości są większe. Dzisiaj pozwala już na to sam CSS, o czym będzie w tym wpisie.