Your CSS Tools

Your CSS Tools: Setup: VS Code, a Browser and Node.js, Your First CSS Rule, Look Inside Any Page with Developer Tools.

Updated

  1. Setup: VS Code, a Browser and Node.js (Novice): Install VS Code with Live Server, a current browser and Node.js on Windows 11 or macOS, then open The Daily Grind's menu page and watch it reload every time you save.
  2. Your First CSS Rule (Novice): Write your first CSS rules on a coffee shop's menu, learn the name of every part (selector, declaration, property and value), and see what the browser does with a typo.
  3. Look Inside Any Page with Developer Tools (Novice): Open the browser's developer tools on any page, find every CSS rule applied to an element, read what a crossed-out line means, and try a change live before you copy it into your stylesheet.