README.md

CSS

C ascading S tyle S heets (CSS) power the colors, fonts, layout and animations that you see in your browser. In the next few pages, we'll learn how to get good at it.

An overview of CSS history

If you are new to CSS, you can read the article blow to get an overview:

• Modern CSS Explained For Dinosaurs

How to Learn CSS

You don’t need to commit to memorizing every CSS Property and Value, as there are good places to look them up. There are some fundamental things, however, which will make CSS much easier for you to use. This article aims to guide you along your path of learning CSS.

CSS Tutorial

We will briefly cover the most important topics in this material, however, if you have more time to go-through a tutorial that covers the topics thoroughly, I can recommend the two below:

• Introduction to CSS
• HTML & CSS is Hard (and It Shouldn't Be)

CSS Reference

Bookmark the link below, you need to refer to it frequently.

• MDN CSS Reference
• Codrops CSS Reference

Resources:

• Beginner materials:
  • CSS Basics
  • CSS Fundamental
  • The CSS Guide
  • CSS Tricks
• Intermediate materials:
  • A to Z CSS
  • Learn CSS Layout
  • All about floats
  • MDN CSS Layouts
• Samples/Galleries
  • HTML/CSS - Katas
  • CSS Zen Garden
  • CSS Deck
  • Envato
  • CSS Tricks Gallery
  • 30 Seconds of CSS
  • CSS Playgrounds
• Useful Tools
  • Can I Use
  • CSS Specificity calculator
• CSS Property Reference
  • CSS Reference
  • A Visual Guide to CSS
• Useful talks on CSS

Labs

• Recreate Blog article Page
• Recreate Apple Landing Page
• CSS Diner

Additional practice

• CSS Exercise on W3Schools
• CSS Kata
• A set of simple html and css exercises
• Step by step creation of a website
• Play with the CSS rules to simulate instagram filters