CSS alapok
Tanuld meg a legfontosabb CSS szabályokat és technikákat, amelyekkel stílusossá teheted a weboldalaidat!
Legnépszerűbb CSS (alapok) leckék kezdőknek
A CSS elsajátítása egyszerűbb, mint gondolnád – bárki megtanulhatja! Ezek az alapok lépésről lépésre vezetnek végig a CSS használatán, így könnyedén megértheted az összefüggéseket és stílusosabbá teheted az oldalaidat.
- Box model – a CSS dobozai
- Méretek: px, em, rem, %, vh … mi ez a fura nyelv?
- Border: keretezd be, de stílussal
- Margók: adj teret
- Háttér: háttérinfó kódokkal
- Szélesség-magasság beállítása
- Overflow: mikor kilógsz a keretből
- Outline: nem border, de majdnem
- Szövegformázás, mint egy profi
- Betűméret vs betűtípus
- Linkek formázása
- Listák: amit a pontozott menükről tudni kell
- Kiemelések, figyelmeztetések, box-shadow
Hasznos eszközök
Ahhoz, hogy valóban hatékonyan tanuld meg a CSS használatát, érdemes profi eszközöket is bevetni. Ezek az online vagy telepíthető eszközök támogatnak a kódolásban, a hibakeresésben, valamint a vizuális tervezésben is. Nézd meg őket, próbáld ki bármelyiket és válaszd ki a kedvencedet!
VS Code
Könnyen használható kódszerkesztő, bővítményekkel turbózható
✓ Szintaxiskiemelés
✓ Automatikus kiegészítés
✓ Élő nézet bővítményekkel
✓ Integrálható GitHubbal
✓ Próbáld ki!
CodePen
Online szerkeszthető HTML, CSS és JS projektekhez, azonnali előnézettel
✓ Böngészőből használható
✓ Valós idejű CSS előnézet
✓ Könnyen megosztható és beágyazható
✓ Próbáld ki!
CSS Scan
Másold ki a weboldal CSS-stílusát egyetlen kattintással
✓ Élő weboldalon működik
✓ CSS másolás és elemzés pillanatok alatt
✓ Tökéletes inspirációs forrás
✓Bővítményként telepíthető
✓ Próbáld ki!
Replit
Gyönyörű színátmenetek villámgyorsan, kódolás nélkül
✓ Előnézet élőben, valós időben
✓ Egyedi színkombinációk
✓ CSS kód automatikus generálása
✓ Próbáld ki!
Népszerű CSS projektek
Ahhoz, hogy magabiztosan kezeld a CSS-t, nem elég csak elméletben ismerned – gyakorlásra is szükséged lesz. Ezek a projetek lépésről lépésre segítenek, és közben egyre jobban fejlődik a vizuális tudásod is.