English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 31 Lessons (05h 02m) | 906 MB
Looking for some CSS layout practice? Join Jen Kramer in creating several different responsive layouts from provided assets, project goals, and expectations. JavaScript is not required to solve any of these layout problems. Each challenge gets progressively more difficult. In the first challenge, we’ll establish some baseline styling that will carry through the other challenges. The final challenge includes 5 different layouts with a single HTML codebase controlled by media queries. CSS concepts in this course include CSS Flexbox, Grid, positioning, overflow, background image magic, columns, variables, media queries, and much more.
By participating along with us in the workshop, you’ll learn:
- Learn to think through and approach CSS projects.
- Debate approaches and understand tradeoffs.
- Code your own solutions with provided assets, goals, and expectations.
- Watch Jen explain her approach and final solution for each problem.
Table of Contents
1 Introduction
2 Style Guide Overview
3 Style Guide Fonts & Font Sizes
4 Style Guide Image & Links
5 Style Guide Colors
6 Columns & Cover Overview
7 Column & Cover Semantic HTML
8 Column & Cover Mobile Layout
9 Column & Cover Media Queries
10 Columns & Cover Desktop Layout
11 Background & Overflow Project Overview
12 Background & Overflow Mobile Layout
13 Background & Overflow Scrollbar
14 Background & Overflow Media Queries
15 Background & Overflow Desktop Layout
16 Grid Project Overview
17 Grid Mobile Layout
18 Grid Tablet Layout
19 Grid Desktop Layout
20 Team Project Overview
21 Team Semantic HTML
22 Team Mobile Layout
23 Team Icons
24 Team Tablet & Desktop Layouts
25 Cards Overview
26 Cards Semantic HTML
27 Cards Mobile Portrait Layout
28 Cards Mobile Landscape Layout
29 Cards Tablet Layout
30 Cards Desktop Layout
31 Wrapping Up
Resolve the captcha to access the links!