HTML Module 2 / Les 2.5 t.b.v. studenten applicatie en mediaontwikkeling MBO Rijnland Leiden

1. 2.5 Variabelen en meer
HTML module 22.5 Variabelen en meer

2. Terugblik!
HTML module 22.5 Variabelen en meer

3. HTML module 22.5 Variabelen en meer
Shape: vierkant
Shape: Cirkel
Shape: Triangle
Shapes

4. HTML module 22.5 Variabelen en meer
Transistions

5. HTML module 22.5 Variabelen en meer
Transform

6. HTML module 22.5 Variabelen en meer
Transform

7. HTML module 22.5 Variabelen en meer
CSS animations

8. HTML module 22.5 Variabelen en meer
CSS animations
Voorbeeld bootje uit les!

9. Lesdoel!
Begrijpen hoe
css variabelen kan
gebruiken
HTML module 22.5 Variabelen en meer

10. Variabelen in css!
HTML module 22.5 Variabelen en meer
Vanaf CSS3 is het mogelijk variabelen te definiëren in CSS.
Variabelen moeten gedeclareerd worden in een CSS Selector
Voor variabelen die je wilt gebruiken in de gehele scope van
een webapplicatie gebruik je de :root of body selector!

11. Variabelen in css!
HTML module 22.5 Variabelen en meer
Schrijfwijze variabelen
De variabele begint met altijd --
Gebruik een naam die herkenbaar is bij het gebruik

12. Variabelen in css!
HTML module 22.5 Variabelen en meer
Variabele voor :root en declareren en gebruiken.

13. Variabelen in css!
HTML module 22.5 Variabelen en meer
Variabele declareren met var’s bestand.
variabelen.css style.css

14. Variabelen in css!
HTML module 22.5 Variabelen en meer
variabelen.css style.css

15. Variabelen in css!
HTML module 22.5 Variabelen en meer

16. Variabelen in css!
HTML module 22.5 Variabelen en meer

17. Variabelen in css!
HTML module 22.5 Variabelen en meer

18. Variabelen in css!
HTML module 22.5 Variabelen en meer

19. Variabelen in css!
HTML module 22.5 Variabelen en meer

20. HTML module 2
Huiswerk opdracht
Maak met behulp van de lesstof 2 websites met dezelfde indeling
die d.m.v. css variabelen een ander onderwerp (logo etc..) krijgt.
Zie voorbeeld op de volgende pagina’s. Maak zelf een ontwerp die
er anders uitziet dan de voorbeelden.
Lever het geheel in als zip bestand in teams opdracht
2.5 uiterlijk de avond voor het begin van de volgende les.
2.5 Variabelen en meer

21. HTML module 2
Huiswerk opdracht
2.5 Variabelen en meer

22. HTML module 2
Huiswerk opdracht
2.5 Variabelen en meer