Webíky

Question 1

Co je CSS a k čemu se používá?

Answer 1

• Cascading Style Sheets = kaskádové styly
• pomocí něj můžeme HTML stránku různě stylovat, či animovat
• upravuje vzhled HTML dokumentu, v HTML styl neděláme

Question 2

Jak lze CSS připojit k HTML dokumentu?

Answer 2

• přímo v HTML hlavičce pomocí <style> elementu</style>
• připojením externího souboru pomocí <link></link> elementu

Question 3

Popište CSS vlastnosti display, margin, padding.

Answer 3

• margin – šířka vnějšího okraje prvku
• padding – šířka vnitřního okraje prvku
• display - určuje, jak je prvek v dokumentu vykreslen - block, none, flex, grid

Question 4

K čemu slouží atributy action a method?

Answer 4

• action: určuje cílovou URL, kam budou data odeslána po odeslání formuláře
• method: určuje metodu pro odeslání dat formuláře (např. “GET” - získání dat ze serveru nebo “POST” - odesílání dat na server)

Question 5

K čemu je dobrý element label?

Answer 5

• k popisu jiného prvku na stránce (<input></input>, <select>…)</select>

Question 6

K čemu slouží hodnoty cover a contain?

Answer 6

• cover říká prohlížeči, aby zakryl celou oblast prvku
• contain naopak říká prohlížeči, aby zobrazil celý obrázek

Question 7

Co jsou pseudotřídy a jaké znáte?

Answer 7

• části selektorů v CSS, které cílí na určité stavy nebo vlastnosti elementů
• :hover, :focus, :link, :visited, :nth-child(), :nth-of-type()

Question 8

Popište rozdíly možností pro tvorbu layoutů(flex, grid)?

Answer 8

• flexbox - jednorozměrný layout (je určen pro uspořádání prvků v jediném rozměru - buď v řádcích nebo sloupcích), spíše pro layout menších komponent, jednodušší
• grid - dvourozměrný layout (umožňuje uspořádání prvků v obou směrech - jak v řádcích, tak ve sloupcích), častější pro layout celé stránky

Question 9

K čemu slouží vlastnost transform?

Answer 9

• K různému transformování elementu, animace
• 1. Rotate – O kolik stupňů se element otočí
     
     2. Scale – Roztáhnutí elementu
     3. Translate – 2D posunutí elementu
     4. Skew – Definuje 2D zešikmení elementu pomocí stupňů
     5. None – element nebude transformován

Question 10

Jakým způsobem lze v CSS vytvořit animaci?

Answer 10

a. Animace lze vytvořit pomocí klíčových snímků (keyframes) a animačních vlastností
b. Keyframes jsou definice jednotlivých kroků animace
c. Definují se pomocí @keyframes a název animace