Core knowledge points of CSS

1. Basic Concepts of CSS

• Definition and Role of CSS
• History of CSS Development
• Basic Syntax Structure of CSS
• Three Ways to Include CSS
• Basic Classification of CSS Selectors
• Cascading and Inheritance Mechanism in CSS
• Priority Calculation Rules in CSS
• CSS Commenting Methods
• CSS Unit System
• Fundamentals of the CSS Box Model

2. Detailed Explanation of CSS Selectors

• Basic Selectors (Element, Class, ID)
• Various Forms of Attribute Selectors
• Classification and Application of Pseudo-Class Selectors
• Use Cases of Pseudo-Element Selectors
• Usage Techniques of Combinator Selectors
• Difference Between Descendant and Child Selectors
• Adjacent Sibling and General Sibling Selectors
• Priority Calculation of Selectors
• Principles of Selector Performance Optimization
• Browser Compatibility of Selectors

3. CSS Box Model and Layout

• Standard Box Model vs. Quirks Box Model
• Detailed Usage of Margin, Border, and Padding
• Box Model Dimension Calculation Methods
• Margin Collapsing Phenomenon and Solutions
• Differences Between Block-Level and Inline Elements
• Various Values of the Display Property
• Principles of Float Layout and Clearing Floats
• Different Positioning Layout Methods
• How z-index Works
• Usage of Box Shadows and Outlines
• Browser Compatibility Issues with the Box Model

4. CSS Positioning and Stacking

• Five Values of the Position Property
• Characteristics and Applications of Relative Positioning
• Positioning Reference for Absolute Positioning
• Special Behavior of Fixed Positioning
• New Features of Sticky Positioning
• Stacking Rules of z-index
• Concept of Stacking Context
• Default Stacking Order Rules
• Methods to Create a New Stacking Context
• Centering Techniques for Positioned Elements

5. CSS Text and Font Styling

• Comprehensive Font Property Settings
• Custom Fonts with @font-face Rule
• Text Color and Background Color Settings
• Text Alignment and Line Height Control
• Text Decoration and Transformation Effects
• Advanced Usage of Text Shadows
• Handling of Whitespace Characters
• Text Overflow and Ellipsis Display
• First-Line Indent and Letter Spacing
• Direction Control for Text Layout
• Usage of Font Icons

6. CSS Backgrounds and Borders

• Multiple Ways to Set Background Colors
• Usage Techniques for Background Images
• Background Positioning and Repeat Control
• Background Attachment and Clipping Effects
• Implementation of Multiple Backgrounds
• Various Styles of Borders
• Advanced Applications of Rounded Borders
• Creative Uses of Border Images
• Layered Effects of Box Shadows
• Background Blend Modes
• Control of Background Size

7. CSS Transitions and Animations

• Basic Usage of the Transition Property
• Detailed Configuration of Transition Properties
• Timing Function Selection for Transitions
• Definition of @keyframes for Animations
• Complete Configuration of Animation Properties
• Control of Animation Playback States
• Fill Modes for Animations
• Performance Optimization for Animations
• Combination Techniques for Complex Animations
• Handling Browser Prefixes for Animations
• Principles of Hardware Acceleration

8. CSS Responsive Design

• Basic Syntax of Media Queries
• Viewport-Related Media Features
• Device-Specific Media Queries
• Selection of Responsive Breakpoints
• Mobile-First Design Strategy
• Handling Responsive Images
• Usage Techniques for Relative Units
• Responsive Applications of Flexbox
• Handling Responsive Tables
• Testing Methods for Responsive Design

9. CSS Preprocessors

• Basic Syntax of Sass
• Features of Less
• Definition and Usage of Variables
• Creation and Application of Mixins
• Advantages of Nesting Rules
• Application of Operations and Functions
• Inheritance and Placeholder Selectors
• Conditional Statements and Loops
• Modular Organization Methods
• Compilation Methods for Preprocessors

10. CSS Architecture and Best Practices

• BEM Naming Methodology
• Design Principles of OOCSS
• Classification Methods of SMACSS
• Layered Architecture of ITCSS
• Organization Structure of CSS Code
• Style Resets and Normalization
• Performance Optimization Strategies for CSS
• Handling Browser Compatibility
• Testing Methods for CSS
• Team Collaboration Standards