Padari savu spēli vizuāli pievilcīgu ar CSS3. Iemācies sagatavot attēlus,
audio failus un sakārtot projektu mapēs kā īsts izstrādātājs.
No CSS bāzes līdz stilizētai spēles lapai ar multimediālo saturu.
Iepazīsti selektorus, krāsas un fonta stilus spēles dizainam.
Izproti margin, border, padding un izkārto elementus ar Flexbox.
Optimizē un konvertē attēlus spēles projektam - PNG, WebP, SVG.
Iemācies sagatavot un iekļaut skaņas efektus un fona mūziku spēlē.
Sakārto projektu mapēs - css/, js/, img/ - kā profesionāls izstrādātājs.
Izmanto CSS lai padarītu savu spēles lapu vizuāli pievilcīgu un responsīvu.
Selektori, Box model, Flexbox un krāsu formāti.
| CSS selektors | Atlasa | Piemērs |
|---|---|---|
p | Visi <p> elementi | p { color: white; } |
.klase | Elementi ar klasi | .spele { width: 800px; } |
#id | Elements ar ID | #punkti { font-size: 24px; } |
a:hover | Saite uzbraucot | a:hover { color: orange; } |
div p | <p> iekš <div> | div p { margin: 0; } |
| Flexbox īpašība | Vērtības | Nozīme |
|---|---|---|
display: flex | - | Ieslēdz Flexbox konteineru |
justify-content | center · space-between · flex-start | Horizontāla izkārtošana |
align-items | center · flex-start · stretch | Vertikāla izkārtošana |
gap | 12px · 1rem | Atstarpe starp elementiem |
flex-direction | row · column | Galvenā ass virziens |