Skip to content

estelle/cssmastery

Repository files navigation

cssmastery

  1. Intro
  2. 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
  3. 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
  4. 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
  5. Media Queries
    1. Media Type, Screen Size, Resolution
    2. Browser Capability @supports
    3. viewport
    4. use cases: Hyphenations, columns, svg
  6. Colors & Appearance
    1. colors
    2. Opacity v. Alphatransparency
    3. appearance
    4. additional pseudo elements
  7. 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
  8. Tables
    1. When to use
    2. Semantics
    3. Caption
    4. Border padding & spacing
    5. Other table properties
    6. styling columns
    7. Good UI
  9. 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
  10. 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
  11. 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
  12. 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
  13. Transitions
    1. Overview
    2. Transition Properties
    3. Properties that can be animated
    4. Need to knows
    5. Events
  14. 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

About

Front End Masters CSS Mastery Class

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published