Boost your CSS skills
☑ Learn CSS
☑ Train your CSS Animations
☑ Train your responsiveness
☑ Train your integration skills
☑ Train a lot of css properties and values
☑ CSS Grid
☑ Flexbox
☑ Etc …
Welcome to the 30 CSS Exercises course.
CSS is a style language that separates people that have to use it in two groups, those whos love it, and those who hate it.
But the question is not to love or hate CSS, it’s there, and we need it.
And except if your website contains only HTML, which is rarely the case, you will have to master it.
And here is the problem, how to master CSS ?
By training !
In this course we will cover a lot of topics through exercises, and the goal for you is to upgrade your research and testing skills.
You need to learn to face a problem and start thinking about a variety of solutions, and test them !
Here are the topics covered :
- Display
- Positions
- Animations
- Transitions
- Responsiveness
- A lot of usefull properties (opacity, fonts properties, z-index, etc …)
- Shadows
- SASS Preprocessor
- Integration (Footer, Form, Hero Page)
- A lot of tricks (checkbox hack, margin collapsing, etc…)
- Flexbox
- CSS GRid
- Selectors
- Etc (look at the curriculum!)
I prepared 2 big folders for you, with the starter files and the final source code of every exercise.
With that you can easily follow the whole course, you just have to watch the instruction video of each exercise, then try to resolve it on your own, and finally watch the resolution video.
Sounds exciting right ? See you on the othe side.
English
Language
Introduction
Introduction
Source Code
1. Alignment
Instructions
Resolution
2. Navbars
Instructions
Resolution
3. Hero Page
Instructions
Resolutions part 1
Resolutions part 2
4. Positions
Instructions
Resolution
5. Display values
Instructions
Resolution
6. Selectors
Instructions
Resolution
7. Video Integration
Instructions
Resolution
8. Blinking animation
Instructions
Resolution
9. Hide and Seek
Instructions
Resolution
10. Margin Collapsing
Instructions
Resolution
11. Responsive Text
Instructions
Resolution
12. Loader
Instructions
Resolution
13. Transitions
Instructions
Resolution
14. Galleries
Instructions
Resolution
15. Flexbox
Instructions
Resolution
16. CSS Grid
Instructions
Resolution
17. Pseudo-Elements
Instructions
Resolution
18. Responsive
Instructions
Resolution
19. Perspective
Instructions
Resolution
20. Parallax
Instructions
Resolution
21. Shadows
Instructions
Resolution
22. Shapes
Instructions
Resolution
23. Units
Instructions
Resolution
24. Carousel
Instructions
Resolution
25. Sign Up Form Integration
Instructions
Resolution HTML
Resolution CSS
26. Animation
Resolution
Resolution
27. The Checkbox Trick
Instructions
Instructions
28. SASS
Instructions
Resolution
29. Complex Footer
Instructions
Resolution HTML
Resolution CSS
30. Marquee
Instructions
Resolution