Learn CSS Media Query - Build 3 Projects in 2021🎖️ || CSS 2021

Опубликовано: 23 Апрель 2021
на канале: Joy Shaheb

9,414

311

In this video, we're going to inspect the components of a CSS Media Query. We will learn little, and write little bit of code. Together, we will do 3 practical projects to completely understand CSS Media Queries.

GitHub Repository : https://github.com/JoyShaheb/Project-...

The Article : https://www.freecodecamp.org/news/lea...

Learn Background Properties :    • Every CSS Background property Explain...

Master CSS Grid -    • Complete Grid Tutorial with Cheat She...
Master Flexbox -    • Complete Flexbox Tutorial with Cheat ...

Interested To be a Professional Web Developer? Then Subscribe today and Join my Gang! 😎 Because this Channel is All about Practical Web Dev projects following industry Best Practices 🎖️

Time Stamps -

0:00 - Intro
1:44 - Setup
21:08 - Project-1
21:10 - @ media rule
22:35 - And operator
24:06 - Media Type
24:39 - Max-Width
27:01 - Min-Width
33:56 - Project-2 Desktop
1:05:55 - Project-2 Mobile
1:14:58 - Project-3 Desktop
1:23:07 - Project-3 Mobile
1:25:53 - Conclusion

Have a Question or Project idea? Let me know about it in the comment box down below. 👇

Check out : https://coolors.co/

Both Suggestions & Criticisms are Highly Appreciated ❤️

Follow me on:
👉 LinkedIn :   / joyshaheb
👉 Twitter :   / joyshaheb
👉 Instagram :   / joyshaheb
👉 Github : https://github.com/JoyShaheb

Queries Solved -
1) CSS Media Query Tutorial
2) How CSS Media Queries work
3) tutorial CSS Media Query
4) how to make responsive websites.
5) CSS Media Query 2021
6) Practice CSS Media Query
7) Responsive website with Media Queries
8) how to make responsive images
9) Responsive images with CSS Media Queries

#CSS #SCSS #WebDev

Image Credits :
Portrait : https://www.pexels.com/photo/woman-we...
Instagram Logo: https://www.flaticon.com/free-icon/in...
Twitter Logo : https://www.flaticon.com/free-icon/tw...
Dribbble Logo : https://www.flaticon.com/free-icon/dr...
Behance Logo : https://www.flaticon.com/free-icon/be...
kitty cup : https://www.vecteezy.com/vector-art/6...
Unicorn cloud : https://www.vecteezy.com/vector-art/6...