Lab 02 - CSS Basics

Goals of the exercise

  • You can fluently use tag, class, id, and pseudo-selectors.
  • You can apply text and background colors.
  • You can create reusable classes.
  • You use and understand the function of normalize.css.
  • You understand the box model and can apply the box-sizing property.
  • You can add external fonts and set a fallback font.
  • You know how to link a stylesheet to an HTML page and optimize selectors for reusability.
  • You can analyze and debug CSS with web developer tools.
  • You make use of advanced selectors (such as combinators and pseudo-classes).
  • You can apply specificity rules.
Go to the solution
The CSS logo

Description

in this lab exercise, we had to create an HTML page and use CSS to create a style. We learned how to work with stuff like margin, padding and other types of selectors etc.

Related items

/

Reflection

  • Wauw

    Using the different selectors and rules went pretty well in my opinion. Adding the various declarations/properties came quite natural to me and were not that difficult to use.

  • Auwch!

    I was stuck for a while with the margin and padding. I think this is something that will definitely create some frustrations further down the line. So, to make sure that I can use these better in the future, I will go over the theory a few times to really understand it.

  • Hmmm?

    Pseudo-class selectors like :nth-child(x) are new to me. I am not always quite sure on what the best use-case scenario is and where I can apply these in the best way.