Boost your CSS skills

What you will learn

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 …

Description

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

Content

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


Get Instant Notification of New Courses on our Telegram channel.


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