3.0 KiB
CSS Refaktorálási Feladat
Célkitűzés
Refaktoráld a terrárium projektet úgy, hogy Flexbox vagy CSS Grid segítségével valósítsd meg a layoutot. Frissítsd az HTML-t és a CSS-t, hogy modern, reszponzív dizájnt érj el. Nem szükséges megvalósítani a húzható elemeket—csak a layoutra és a stílusra koncentrálj.
Útmutató
- Hozz létre egy új verziót a terrárium alkalmazásból. Frissítsd a markupot és a CSS-t, hogy Flexbox vagy CSS Grid alapú legyen a layout.
- Biztosítsd, hogy a művészeti elemek és az összetevők ugyanúgy jelenjenek meg, mint az eredeti verzióban.
- Teszteld a dizájnt legalább két különböző böngészőben (pl. Chrome, Firefox, Edge).
- Készíts képernyőképeket a terráriumról minden böngészőben, hogy bemutasd a kompatibilitást.
- Nyújtsd be a frissített kódot és a képernyőképeket.
Értékelési Szempontok
| Kritérium | Kiemelkedő | Megfelelő | Fejlesztésre Szoruló |
|---|---|---|---|
| Layout | Teljesen refaktorált Flexbox vagy CSS Grid használatával; esztétikus és reszponzív | Néhány elem refaktorálva; részleges Flexbox vagy Grid használat | Kevés vagy semmilyen Flexbox vagy Grid használat; változatlan layout |
| Böngészőközi kompatibilitás | Képernyőképek több böngészőről; következetes megjelenés | Képernyőképek egy böngészőről; kisebb eltérések | Nincsenek képernyőképek vagy jelentős eltérések |
| Kódminőség | Tiszta, jól szervezett HTML/CSS; egyértelmű kommentek | Néhány szervezettség; kevés komment | Szétszórt kód; hiányzó kommentek |
Tippek
- Nézd át a Flexbox és a CSS Grid útmutatókat.
- Használd a böngésző fejlesztői eszközeit a reszponzivitás teszteléséhez.
- Kommenteld a kódodat az érthetőség érdekében.
Felelősség kizárása:
Ezt a dokumentumot az Co-op Translator AI fordítási szolgáltatás segítségével fordították le. Bár törekszünk a pontosságra, kérjük, vegye figyelembe, hogy az automatikus fordítások hibákat vagy pontatlanságokat tartalmazhatnak. Az eredeti dokumentum az eredeti nyelvén tekintendő hiteles forrásnak. Kritikus információk esetén javasolt professzionális emberi fordítást igénybe venni. Nem vállalunk felelősséget a fordítás használatából eredő félreértésekért vagy téves értelmezésekért.