- Leren door doen
- Trainers met praktijkervaring
- Klassikale trainingen
- Gedetailleerd cursusmateriaal
- Duidelijke inhoudsbeschrijving
- Maatwerk inhoud mogelijk
- Trainingen die doorgaan
- Kleine groepen
In de cursus CSS Fundamentals van SpiralTrain leren de deelnemers Cascading Style Sheets (CSS) te gebruiken bij de opmaak van HTML Web pagina's. Met CSS wordt bepaald hoe HTML elementen in de browser worden getoond. Typisch worden CSS styles in aparte CSS Styleheets opgenomen en refereren HTML pagina's aan deze stylesheets. Verschillende HTML pagina's in een Web Site kunnen zo gelinked worden aan één enkele stylesheet waardoor de styling makkelijk op een centraal punt kan worden aangepast.
De cursus CSS Fundamentals biedt een grondige inleiding in de basisprincipes van CSS. In deze cursus leren deelnemers hoe CSS selectors HTML-elementen selecteren op basis van ID- of class-attributen, of hun positie in de hiërarchie van de pagina. Hierdoor kunnen ze de juiste styling toepassen, wat essentieel is voor webdesign.
Vervolgens wordt er dieper ingegaan op de CSS-syntax met behulp van de opmaak van tekst, waaronder kleuren, fonts en achtergronden. Ook het cascading aspect van CSS en het concept van inheritance worden uitvoerig besproken. Dit helpt deelnemers te begrijpen hoe stijlen zich kunnen stapelen en overerven.
Een belangrijk onderdeel van de cursus is het CSS Box Model. Bij de lay-out van een HTML-pagina representeert de rendering engine van de browser elk element als een rechthoek volgens het CSS Basic Box Model, dat bestaat uit margin, padding en outline. Dit model is cruciaal voor het begrijpen van de opmaak en afstand tussen elementen.
De cursus behandelt ook hoe CSS kan worden gebruikt om de lay-out van de pagina te controleren. Elementen hebben standaard block- of inline-displaywaarden, maar deze kunnen met CSS worden aangepast. Andere CSS-layoutattributen zoals float en overflow worden eveneens besproken, zodat deelnemers flexibele en responsieve ontwerpen kunnen maken.
Daarnaast komt aan bod hoe CSS de weergave van tabellen, lijsten en grids kan beïnvloeden. Er wordt aandacht besteed aan de verschillende gap properties die daarbij worden gebruikt, wat essentieel is voor het creëren van gestructureerde en overzichtelijke layouts.
Tenslotte worden een aantal geavanceerde toepassingen van CSS besproken in de cursus CSS Fundamentals. Dit omvat het aanbrengen van ronde hoeken, het werken met schaduwen en kleurverlopen. Ook worden 2D- en 3D-transformaties met CSS3 behandeld, waardoor deelnemers hun creativiteit kunnen uiten in webdesign.
Voor meer geavanceerde technieken kun je ook kijken naar onze cursus Sass and Less Preprocessing. Voor meer informatie over CSS kun je de officiële CSS documentatie raadplegen.
De cursus CSS Fundamentals is bedoeld voor personen die het gebruik van CSS voor de opmaak van web pagina's willen leren.
Voor deelname aan deze cursus zijn geen specifieke vaardigheden of kennis nodig.
De concepten worden behandeld aan de hand presentatie slides. Een demo website wordt gebruikt om de concepten te verduidelijken. Er wordt ook aandacht besteed aan hands-on oefeningen. De cursustijden zijn van 9.30 tot 16.30.
De deelnemers krijgen na het goed doorlopen van de cursus een officieel certificaat CSS Fundamentals.
Module 1 : CSS Intro |
Module 2 : Text and Fonts |
Module 3 : CSS Box Model |
|
What is CSS? CSS Standard CSS Syntax CSS Selectors Basic Selectors CSS Rules Styling in Place Internal Style Tag External Style Sheets What is Cascading? Checking Browser Support Caniuse Site |
Working with Fonts Formatting Text Font Families Font Style and Size Font Color Font Web Safe Font Fallbacks Text Alignment Text Decoration Text Transformation Borders CSS Backgrounds |
Basic Box Model Margin Edge Padding Edges Content edge Border Edge Margin Collapsing Box Background Containing Block CSS Outline Outline Shorthand Outline Offset Outline Width |
Module 4 : CSS Layout |
Module 5 : Tables and Grids |
Module 6 : CSS Advanced |
|
Layout Concepts display Property Block Level Elements Inline Elements Units of Measurement width and max-width Element Positioning Position and Overflow float Property Overflow inline Blocks |
Table Borders Table Styles Collapsing Borders Full-Width Tables Styling Lists Navigation Bar Grid Layout Grid Elements Grid Columns CSS Counters CSS Links |
CSS Rounded Corners CSS Combinators Pseudo Classes Pseudo Element CSS Gradients CSS Shadows Text Effects CSS Resets CSS3 Transformations 2D Transforms 3D Transforms |