About the Course
An advanced CSS course touching on responsive web design technologies including:
- flexbox
- grid layout
- media queries
And also an inclusion of SASS – Syntactically Awesome Stylesheet.
Objectives
This course is built and structured to make reponsive concepts in easy to grasp.
You will learn to work with:
- flexbox and its properties. Properties that affects the flex container and flex items.
- grid layouts and so many special grid properties to create different layouts and designs.
- media queries, breakpoints and working with different design approaches (mobile-first approach and desktop-first approach).
- SASS technology, its different features that makes it an amazing tool to use for styling and also why you might prefer SASS over standard CSS.
Who the course is for
The course is an advanced CSS course, so some basic knowledge of HTML and CSS is highly recommended. The course focuses more on making designs responsive and so some other properties in CSS might not be totally explained.
Section 1 - Welcome
vs code - https://code.visualstudio.com/download
Google chrome - https://www.google.com/chrome/
Section 2 - Flexbox
You can check our this YouTube video to undersand em and rem even better
TRY OUT WHAT YOU LEARNED SO FAR.
ANOTHER CHALLENGE TO TRY OUT YOUR FLEXBOX SKILLS.
Section 3 - Grid layout
Try out your first grid challenge.
Time to try out your second grid challenge.
Section 4 - Media queries
Try out this challenge on media query using grid.
section 5 - SASS Technology
Check out the sass documentation and other installation processes on their official website.
Section 6 - Porfolio page project
You can check out this website for the template used in this project and also to check out others you can try out yourself.
So I figured out the Javascript issue 😊 I forgot the defer attribute in my <script> tag on the HTML document.
So replace,
Be the first to add a review.
Related Courses
