Sass Tutorial for Beginners - CSS With Superpowers

Sass Tutorial for Beginners - CSS With Superpowers

freeCodeCamp.org via freeCodeCamp Direct link

main.scss / _config.scss

20 of 34

20 of 34

main.scss / _config.scss

Class Central Classrooms beta

YouTube videos curated by Class Central.

Classroom Contents

Sass Tutorial for Beginners - CSS With Superpowers

Automatically move to the next video in the Classroom when playback concludes

  1. 1 Intro
  2. 2 What Is Sass?
  3. 3 Requirements
  4. 4 Install/Setup Live Sass Compiler VS Code Extension
  5. 5 Folder Structure / Sass Syntax
  6. 6 Variables
  7. 7 Maps
  8. 8 Nesting
  9. 9 Partials
  10. 10 Functions
  11. 11 Mixin Example 1
  12. 12 Mixin Example 2
  13. 13 Mixin Example 3
  14. 14 Extend
  15. 15 Math Operations
  16. 16 How to Learn More (Documentation)
  17. 17 Real-World Example From Scratch (Portfolio Site)
  18. 18 index.html
  19. 19 Font Awesome Setup
  20. 20 main.scss / _config.scss
  21. 21 _home.scss
  22. 22 Transition Ease Mixin
  23. 23 Text Color Function
  24. 24 _menu.scss
  25. 25 main.js
  26. 26 Menu cont.
  27. 27 about.html
  28. 28 _about.scss
  29. 29 projects.html
  30. 30 _projects.scss
  31. 31 contact.html
  32. 32 _contact.scss
  33. 33 _responsive.scss
  34. 34 Deploy on Github Pages

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.