Posts List

CSS Variables

CSS Variables

CSS już dawno przestał być językiem służacym tylko do kolorowania stron internetowych. Każda kolejna wersja pozwala robić coraz więcej na stronie bez konieczności sięgania do Javascriptu lub preprocesorów CSS takich jak SASS czy LESS. Dziś chciałbym po krótce opowiedzieć o czymś co w preprocesorach istnieje od dawna a teraz jest też możliwe bez nich czyli tworzenie zmiennych wewnątrz plików.

CSS Transform

CSS Transform

Jak wspominałem we wpisie dotyczącym animacji (jeśli go nie czytaliscie to zapraszam tutaj) podczas tworzenia poszczególnych klatek możemy swobodnie przekształcać animowany obiekt. Poruszać go, zmieniać rozmiar, kształt czy też obracać go. Nie potrzebujemy do tego doatkowych biblotek czy też JS’a. Wszytsko to możemy osiągnąć przy pomocy właśności transform w CSS.

Animacje w CSS

Animacje w CSS

CSS już dawno przestał być tylko językiem do kolorowania naszej strony czy formatowaniu tekstu. Kolejne wersje dodają coraz bardziej zaawansowane elementy do niego co powoduje, że niektóre czynności, do których wcześniej potrzebowaliśmy skryptów i zewnętrznych bibliotek, jesteśmy w stanie ograć samym CSS’em. Dziś chciałbym omówić jedną z nich czyli animacje.

Szybka powtórka z selektorów CSS

Szybka powtórka z selektorów CSS

Dziś chciałbym się pochylić nad całkowitymi podstawami CSS bez których nie dałoby się czegokolwiek ostylować. Selektory są używane cały czas podczas tworzenia stron i cały czas dochodzą nowe, które mają ułatwiać nam pracę. Również powoli szykują się selektory 4-tego poziomu, o których chcę napisać parę słów w drugiej części postu.

CSS-Grid

CSS-Grid

Nie wiem czy śledzicie nowinki ze świata css ale niedawno pojawiła się w nim nowość w postaci CSS-Grid. Pozwala w prosty sposób stworzyć szablon strony w czystym css. Jest to druga nowość obok już popularnego flexboxa, która ułatwia ustawianie elementów na stronie dlatego warto go poznać i zacząć używać, szczególnie, że według canIUse większość przeglądarek już go wspiera

Czym są? – SCSS i BEM

SCSS jest tym dla CSS czym Typescript dla JavaScript’u. Pozwala nam w prosty sposób rozszerzyć możliwości zwykłego CSS . Natomiast BEM jest zbiorem zaleceń dotyczących tworzenia i nazewnictwa klas. I obie te rzeczy idealnie ze sobą współpracują.