π Hello, I'm Dave Gray.
β Check out my YouTube Channel with all of my tutorials.
β Buy Me A Coffee
π Follow Me:
πΊ YouTube Playlist for this repository.
π This repository shares ALL of the resources referenced during the CSS tutorial series.
DO NOT COPY FOR AN ASSIGNMENT - Avoid plagiarism and adhere to the spirit of this Academic Honesty Policy.
- π Google Chrome Web Browser
- π Visual Studio Code (aka VS Code)
- π Live Server VS Code Extension
- π vscode-icons VS Code Extension
- π Github Themes VS Code Extension
- π W3C CSS Validator
- π Specificity Calculator
- π HTML Special Characters
- π Can I Use
- π Flexbox Froggy
- π CSS Grid Garden
- π MDN: CSS
- π MDN: CSS Basics
- π MDN: Applying Color to HTML Elements using CSS
- π MDN: CSS Values and Units
- π MDN: The Box Model
- π MDN: Styling Lists
- π MDN: Display Property
- π MDN: Floats
- π MDN: Basic Concepts of MultiCol
- π MDN: Margin Collapsing
- π MDN: Position
- π MDN: Flexbox
- π MDN: Basic Concepts of Grid Layout
- π MDN: Grid Template Areas
- π MDN: CSS Images
- π MDN: CSS Background Images
- π Chip Cullen: Content Layout Shift
- π MDN: CSS Media Queries
- π MDN: CSS Pseudo-Classes and Pseudo-Elements
- π MDN: CSS List of Pseudo-Classes
- π MDN: CSS List of Pseudo-Elements
- π MDN: CSS Custom Properties (Variables)
- π MDN: CSS Functions
- π MDN: CSS Transform
- π MDN: CSS Transition
- π MDN: CSS Animations
- π MDN: Organizing Your CSS
- π Scott O'Hara: Ordering CSS for Everyone
- π Get BEM: Introduction
- π MDN: Grid and The Danger of Markup Flattening
- π CanIUse.com: display: contents
- π MDN: Fundamental Text and Font Styling
- π CSSFontStack.com: Websafe Fonts
- π MDN: Styling Links
- π MDN: White-Space
- π Coolors Contrast Checker
- π WebAIM Contrast Checker
- π Coolors Palette Generator
- π ColorHub.app Palette Generator
- π HTML Color Codes
- Placeholder Image Generators:
- π 21 of the Best
- Sites with Freely-Usable Images:
- π Unsplash.com
- π Pexels.com
- π Gratisography.com
- π Pixabay.com
- Image Editing / Resizing Software:
- π For Windows: Irfanview
- π As a Service: Canva.com
- π Suggestions for Macs
- Full Featured Editor for Windows/Mac/Linux:
- π Gimp
- Image Compression (shrink file size):
- π TinyPNG
- π Chapter 2 Starter Code
- π Chapter 3 Starter Code
- π Chapter 4 Starter Code
- π Chapter 5 Starter Code
- π Chapter 6 Starter Code
- π Chapter 7 Starter Code
- π Chapter 8 Starter Code
- π Chapter 9 Starter Code
- π Chapter 10 Starter Code
- π Chapter 11 Starter Code
- π Chapter 12 Starter Code
- π Chapter 13 Starter Code
- π Chapter 13 Completed Code
- π Chapter 14 Starter Code
- π Chapter 14 Completed Code
- π Chapter 15 Starter Code
- π Chapter 15 Completed Code
- π Chapter 16 Starter Code
- π Chapter 16 Completed Code
- π Chapter 17 Starter Code
- π Chapter 17 Completed Code
- π Chapter 18 Starter Code
- π Chapter 18 Completed Code
- π Chapter 19 Starter Code
- π Chapter 19 Completed Code
- π Chapter 20 Starter Code
- π Chapter 20 Completed Code
- π Chapter 21 Starter Code
- π Chapter 21 Completed Code
- π Chapter 22 Starter Code
- π Chapter 22 Completed Code
- π Chapter 23 Starter Code
- π Chapter 23 Completed Code
- π Chapter 24 Starter Code
- π Chapter 24 Completed Code
π©π©π© πΊ Youtube Video for the Bonus Lesson