Intermediate 4.1
12 months 30 days
$128.00 $102.00
0 Learners 22 Reviews 2 Favorites
- Overview
- Outline
- Reviews
Forget the size of the device, one set of codes adapts to multiple terminals, and responsive development allows the perfect combination of user experience and development efficiency.
preliminary preparation
- course arrangement17:36
- course description18:45
- Concepts of responsive website design15:06
- Advantages of responsive websites23:48
- Browser overview26:14
- Media Inquiry-117:04
- Media Inquiry-214:25
- Media Enquiries-328:19
- How to analyze design drawings14:58
- Practical principles of responsive website design17:45
How to organize the project directory structure
- brief description of19:43
- Organization of folders13:03
- Useful file 1 (robots.txt, favicon.ico, humans.txt)12:25
- Useful files 2 (.editorconfig, gitignore)27:17
- Useful Files 3 (LICENSE.txt, README.md, CHANGELOG.md)23:58
- Useful File 4 (markdown)28:06
Start writing HTML code
- began20:40
- Introduction to header section and new tags added to HTML527:21
- footer part19:23
- Main content 112:32
- Main content 227:51
- Main content 312:03
- Coursework 0128:11
How to implement the PC style
- CSS Resets11:40
- px,em,rem10:17
- Clear Float 113:27
- Clear Float 219:42
- Header and footer styles26:00
- Main content style 116:38
- Main content style 210:18
How to implement mobile style
- Responsive layout debugging tool16:31
- How to choose a media inquiry unit 115:01
- How to implement the mobile style-How to choose a media query unit 228:14
- CSS3 Selector 127:05
- CSS3 Selector 220:38
- Style Writing 125:01
- Style Writing 2 (Platform features, latest announcements, product sections)12:21
- Style Writing 3 (bottom navigation and summary table processing method)19:38
- plot style16:24
- Coursework 0217:26
How to implement responsive advertising and responsive pictures
- How to implement responsive advertising-120:41
- How to implement responsive advertising-227:44
- How to implement responsive advertising-320:41
- How to implement responsive images-Overview 1 (JS or server-side implementation)26:10
- How to implement responsive pictures-Overview 2 (srcset method)22:37
- How to implement responsive pictures-sizes (sizes solves srcset pits)24:44
- How to achieve responsive pictures-picture tag12:48
- How to implement responsive images-svg23:33
- How to implement responsive pictures-Specific implementation of responsive advertising16:55
- Job 0324:59
Introduction to Node.js
- Introduction to Node.js-1 (Nodejs)18:09
- Introduction to Node.js-2 (npm usage)15:14
- Introduction to Node.js-3 (using npm)23:08
- Introduction to Node.js-4 (nodejs launches server service)23:31
How to handle compatibility and debug on multiple devices
- How to handle compatibility-How to debug desktop-120:01
- How to handle compatibility-How to debug desktop-224:04
- How to handle compatibility-How to debug mobile24:09
- How to handle compatibility-How to handle compatibility27:48
- How to debug on multiple devices21:01
- Job 0419:46
How to package and publish
- How to package and publish-113:31
- How to package and publish-229:01
- How to package and publish-327:38
- summary13:38
Course Extension 1 -Choose a suitable IDE
- Basic operations of Webstorm22:42
- Emmet-127:33
- Emmet-222:51
- Emmet-310:49
- Emmet-422:14
- WebStorm Advanced Operation-Thoughtful and Easy to Use Small Features-122:14
- WebStorm Advanced Operation-Thoughtful and Easy to Use Small Features-219:10
- WebStorm Advanced Operation-Thoughtful and Easy to Use Small Features-317:40
- Advanced WebStorm Operations-Refactoring16:12
- Advanced WebStorm Operations-Code Error Tips16:14
- Introduction to popular responsive frameworks14:35
- summary24:21
Course Extension 2 -Talking about Prototyping and Cutting
- Axure26:41
- Sketch25:10
- away view27:47
- interaction design19:18
Course homework
- big job10:19
Instructor
Web前端工程师