ConsoleLogMyLife
HTML CSS Javascript Polityka prywatności

Kurs CSS od podstaw

lekcje

Pierwsze style CSS – kolor, czcionka, tło

color, background, font-family, font-size, text-align, zewnętrzny CSS

podstawowy ~18-22 min

Jak działają selektory i model pudełkowy

Selektory, box model, margin, padding, border, box-sizing: border-box

podstawowy ~15-20 min

Kolory w CSS – RGB, HSL, opacity, zmienne

rgb, hsl, rgba, hsla, opacity, :root, var(), custom properties

podstawowy ~15-18 min

Flexbox – pierwsze układy

display: flex, justify-content, align-items, gap, flex

podstawowy ~18-22 min

CSS Grid – dwuwymiarowe układy

display: grid, grid-template-columns, fr, repeat, minmax, auto-fit

podstawowy ~18-22 min

Responsywność – media queries, mobile-first + nowoczesne jednostki

@media, mobile-first, clamp, rem, dvh, procenty

podstawowy ~20-24 min

Animacje CSS – transitions, animations, keyframes

Animacje i transformacje, @keyframes, transition, transform

średni ~20-24 min

Zaawansowane selektory i pseudo-elementy

:has(), :nth-child, :where, ::before, ::after, ::selection

średni ~15-20 min

Pozycjonowanie elementów – position, z-index, overflow

position: relative / absolute / fixed / sticky, z-index, overflow

średni ~15-20 min
Najczęściej używane zasoby / szybka pomoc

Jak wyśrodkować diva

Jak wyśrodkować diva (wszystkie sposoby 2025)

przydatne strony i dokumentacja
MDN Web Docs – CSS

Najlepsza, aktualna i szczegółowa dokumentacja CSS.

Przejdź →
CSS Reference (cssreference.io)

Szybkie zestawienie wszystkich właściwości CSS z przykładami.

Przejdź →
Can I Use...

Wsparcie właściwości CSS w różnych przeglądarkach.

Przejdź →
CSS Tricks

Praktyczne artykuły, triki i nowoczesne rozwiązania CSS.

Przejdź →
Flexbox & Grid Playground

Interaktywne narzędzie do nauki Flexbox i CSS Grid.

Froggy Garden
W3C CSS Validator

Sprawdź poprawność swojego kodu CSS.

Przejdź →