- Overview
- Outline
- Reviews
CSS is an indispensable knowledge point in the front-end development process and the most difficult part to master completely. This course systematically sorts out various aspects of CSS to help front-end engineers understand more clearly how to apply CSS technology in practical work.
course introduces
- learners 'guidance17:39
HTML basics strengthened
- Common HTML elements and understandings (1)10:51
- Common HTML elements and understandings (2)18:54
- Common HTML elements and understandings (3)10:03
- HTML version25:51
- element classification17:03
- nested relationship27:45
- Default styles and reset21:31
- real questions14:52
CSS basics
- Selector (1)23:59
- Selector (2)16:47
- Non-layout styles (fonts)11:08
- Non-layout style (row height)24:53
- Non-layout style (background)23:22
- Non-layout style (border)15:31
- Non-layout styles (scrolling)15:30
- Non-layout styles (text folds)18:48
- Non-layout styles (decorative attributes)13:53
- Hack and Cases (1)12:35
- Hack and Cases (2)17:34
- Interview Question (1)21:52
- Interview Questions (2)12:10
CSS layout
- Layout Introduction16:24
- Layout method (table)16:42
- Some layout attributes18:21
- flexbox layout12:17
- float layout22:53
- inline-block layout24:10
- Responsive Layout (1)24:19
- Responsive Layout (2)18:00
- Layout used by mainstream websites19:08
- CSS Interview Questions29:47
CSS effects
- box-shadow20:58
- text-shadow_x26416:12
- border-radius28:01
- background21:24
- clip-path17:50
- 3D-transform15:06
- CSS interview questions23:59
CSS animation
- cartoon presenting28:16
- transition animation (1)26:32
- transition animation (2)15:17
- keyframes animation15:32
- frame-by-frame animation17:08
- CSS interview questions22:37
the preprocessor
- introduced10:22
- less nesting25:50
- sass nesting (1)26:09
- sass nesting (2)24:56
- less variable18:06
- sass variable10:17
- less mixin26:23
- sass mixin26:45
- less extend11:20
- sass extend12:48
- less loop15:33
- sass loop25:22
- less import26:31
- sass import18:50
- Preprocessor Framework (1)22:09
- Preprocessor Framework (2)11:19
- real questions17:25
Bootstrap
- Introduction to Bootstrap23:09
- Basic usage of Bootstrap (1)22:05
- Basic usage of Bootstrap (2)11:38
- Bootstrap JS components29:33
- Bootstrap responsive layout26:23
- Bootstrap customization21:05
- CSS Real Questions22:36
CSS engineering solution
- Introduction to PostCSS20:56
- Use of PostCSS plug-in (1)19:10
- Use of PostCSS plug-in (2)23:29
- cssnext25:29
- precss21:39
- gulp-postcss22:11
- webpack18:39
- webpack handles CSS15:47
- css-modules and extract-text-plugin27:12
- webpack summary11:50
- real questions19:30
CSS in the three major frameworks
- CSS in Angular (1)17:53
- CSS in Angular (2)29:04
- CSS in Angular (3)29:38
- CSS in Vue (1)11:11
- CSS in Vue (2)20:12
- CSS in React (1)28:07
- CSS in React (2)16:54
- CSS in React (3)25:28
- CSS in React (4)29:58
practical case
- case introduction12:22
- header17:54
- banner26:56
- main21:07
- Footer and page adjustments24:46
- animation14:35
- progress12:07
- dialog22:34
course summary
- course summary19:17