Labo 2 - CSS
Doel van de opgave
- Vlot tag-, class-, id- en pseudo-selectoren leren gebruiken.
- Tekst- en achtergrondkleuren leren toepassen.
- Herbruikbare classes leren maken.
- Leren werken met normalize.css.
- Inzicht creëren in het box-model en de box-sizing property leren toepassen.
- Externe lettertypen en fallback-fonts leren toevoegen.
- Leren hoe je een stylesheet aan een HTML-pagina koppelt en selecties kunt optimaliseren voor herbruikbaarheid.
- Leren hoe je CSS kunt analyseren en debuggen met webdeveloper tools.
- Prioriteitsregels leren toepassen.
Beschrijving
In deze opdracht was het de bedoeling om een website na te maken. De eerste stap bestond uit het volledig opbouwen van de website met HTML, zodat de structuur goed stond. Daarna volgde de tweede fase, waarin het de bedoeling was om met CSS aan de slag te gaan om de website er beter te laten uitzien. Hierbij was het de opdracht om onder andere het lettertype aan te passen, de achtergrondkleur en tekstkleur te wijzigen, marges en padding in te stellen, highlights toe te voegen en een hover-effect te maken,...
Gebruikte links
Reflectie
Het HTML-gedeelte van de opdracht was zeer goed te doen en ging tamelijk vlot. Voor het CSS-gedeelte heb ik veel gebruikgemaakt van de PowerPoint uit de theorieles, aangezien CSS volledig nieuw voor mij is en ik dus niet goed wist hoe ik ermee moest werken. Zaken zoals het toevoegen van nieuwe fonts en kleuren had ik al snel door, en ook het instellen van marges en padding ging tamelijk gemakkelijk. Maar enkele andere onderdelen, zoals het gebruik van classes, box-sizing, child selectors, ... waren wat moeilijker, en hiervoor heb ik de slides uit de theorieles grondig moeten bekijken.
Ondanks dat sommige onderdelen meer tijd vroegen dan andere, merkte ik naar het einde van het labo toe wel dat ik CSS beter begon te begrijpen en dat ik enkele basiscommando’s al tamelijk snel onder de knie begon te krijgen.