6. diel - Úprava vzhľadu aplikácie pomocou CSS Nové
V minulej lekcii, Prvé HTML rozhranie vo VS Code s Codexom , sme pomocou Codexu vytvorili prvé statické HTML rozhranie portálu EnergoSun a vysvetlili si základné HTML značky.
V tomto tutoriále kurzu vývoja aplikácií s AI využijeme
Codex vo Visual Studio Code na úpravu
vzhľadu portálu EnergoSun. Necháme ho vytvoriť súbor
styles.css s pravidlami jazyka CSS, ktorými
nastavíme farby, písmo a responzívne zobrazenie stránky. Súčasne si
ukážeme nastavenie cieľa práce, schvaľovanie akcií a voľbu úrovne
uvažovania. Pre rýchle vysvetlenie vybranej časti kódu využijeme aj
GitHub Copilot Chat.
Výsledok štylovania
HTML určuje obsah a štruktúru stránky, ale samo o sebe neurčuje jej výsledný vizuálny štýl. CSS si môžeme predstaviť ako grafickú úpravu dokumentu - obsah zostáva rovnaký, ale môžeme meniť farby, písmo, rozmiestnenie a vzhľad jednotlivých prvkov.
Po doplnení CSS bude portál vyzerať takto:
Konkrétna podoba sa môže podľa návrhu Codexu mierne líšiť. Budeme ale smerovať k jednoduchému a prehľadnému vzhľadu internej firemnej aplikácie s jednotným použitím zvolených farieb.
...koniec náhľadu článku...
Pokračuj ďalej
Došiel si až sem a to je super! Veríme, že ti prvé lekcie ukázali niečo nového a užitočného.
Chceš v kurze pokračovať? Prejdi do prémiovej sekcie.
ročné PREDPLATNÉ
44 €
mesačne, platené ročne (528 €)14 000+ lekcií, cvičení a testov
6 000+ ti zostane navždy
Neobmedzený prístup ku všetkým aktuálnym
aj pripravovaným kurzom.
Kúpiť iba tento kurz
Získaj okamžitý prístup ku kurzu bez
časového obmedzenia.
5 €
Obsah článku spadá pod licenciu Premium, kúpou článku súhlasíš s Prevádzkovými podmienkami.
- Prístup k jednotlivým lekciám podľa spôsobu obstarania.
- Kvalitné znalosti v oblasti IT.
- Zručnosti, ktoré ti pomôžu získať vysnívanú a dobre platenú prácu.
Popis článku
Požadovaný článok má nasledujúci obsah:
V tutoriále vo Visual Studio Code pomocou Codexu vytvoríme CSS štýly, overíme responzívne zobrazenie a využijeme GitHub Copilot Chat na vysvetlenie kódu.
