Skip to content

This workshop will give a short introduction to styling (CSS), and contain assignments aimed at practising the fundametals of styling for modern websites.

Notifications You must be signed in to change notification settings

nerdschoolbergen/Styling-fundamentals

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Styling Fundametals

This workshop will give a short introduction to styling (CSS), and contain assignments aimed at practising the fundametals of styling for modern websites.

Presentation slides

You can find the presentation slides here

What you need

  • Any modern web browser: Firefox, Chrome etc
  • We will use Codepen (online code editor) to solve the tasks

Exercises

Exercise 1 - The cascade, selectors, and specificity

Exercise 2 - Sizing and the box model

Exercise 3 - Layout using grid

Exercise 4 - Making it responsive with media queries

Exercise 5 - Introduction to transform and transition

Exercise 6 - Layout using float

Exercise 7 - Freestyle

Icons with special meaning

  • ✏️ - A task you should do
  • 📖 - A section of text to read (no tasks, just information).
  • 💡 - Additional information.
  • ❗ - Something important.
  • ❓ - Open-ended question for the reader ("What do you think would happen if...")
  • 💩 - Bad practice (don't-do-this)
  • ⭐ - A bonus task (not required)

About

This workshop will give a short introduction to styling (CSS), and contain assignments aimed at practising the fundametals of styling for modern websites.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published