cssmastery's Introduction

cssmastery

Intro
Selectors
1. overview
2. Specificity intro
3. Relational selectors & Combinators
4. Selectors API
5. Attribute Selectors
6. UI Pseudo Class Selectors
7. Structural selectors
8. Other Logical Combinations: Negation, Matching and Parent
9. Language based selectors
10. Link, location & user action pseudo-classes
11. Additional Pseudo Classes
12. Specificity Revisited
Pseudo-Elements
1. first letter
2. first line
3. selection
4. before, after and generated content
5. selection
6. additional pseudo elements
7. browser specific pseudo elements
Generated Content
1. How before and after work
2. How generated content works
3. Generated content: quotes
4. Generated content: Attribute Values
5. Generated content: Counters
6. Generated content: Images
7. Generated content: Strings
8. Special Characters
9. Accessibility
10. Design Elements
Media Queries
1. Media Type, Screen Size, Resolution
2. Browser Capability @supports
3. viewport
4. use cases: Hyphenations, columns, svg
Colors & Appearance
1. colors
2. Opacity v. Alphatransparency
3. appearance
4. additional pseudo elements
Flexbox
1. Purpose and goal of flexbox
2. browser support and specification
3. Overview
4. The basics
5. Flex container properties
6. Flex item properties
7. Flexibility
Tables
1. When to use
2. Semantics
3. Caption
4. Border padding & spacing
5. Other table properties
6. styling columns
7. Good UI
Grid
1. Overview (flex v grid)
2. Basic Grid
  1. Display property
  2. Defining columns and rows
  3. fr unit and repeat() notation
  4. Adding gutters
  5. Try it out
3. Positioning grid items
4. Container properities
  1. Align and justify items
  2. Align and justify content
Backgrounds and Borders
1. Overview
2. Background properties
3. background-color
4. Old background shorthand for single image
5. Overview of added properties
  1. background-image'
  2. background-repeat
  3. background-attachment
  4. background-position
  5. background-clip
  6. background-origin
  7. background-size
  8. background shorthand
Gradients
1. Overview
2. Syntax
3. Color Stops
4. Color Hints
5. Directions
  1. Keyterms
  2. Angles
6. Examples & exercise
7. Repeating Linear Gradients
8. Radial Gradients
9. Position
10. Size & Shape
11. Radial Gradients: color-stops & color-hints
12. Repeating Radial Gradient
Transforms
1. Overview
2. 2D Transform Functions
3. Order of functions
4. Transform Origin
5. 3D Transform Funtions
6. 3D Transform related properties
  1. Perspective
  2. Perspective-origin
  3. transform-origin
  4. transform-style
  5. transform-box
Transitions
1. Overview
2. Transition Properties
3. Properties that can be animated
4. Need to knows
5. Events
Animations
1. Overview
2. @keyframes
3. Animation Properties
4. Specificity
5. Timing functions
  1. steps
6. Iteration count
7. Delays
8. direction
9. shorthand
10. animation-fill-mode
11. stopping animations
12. Events

cssmastery's Issues