Introduction to Media Queries!

Media queries are CSS selectors that allow us to apply styles for different viewpoints and breakpoints.

Viewpoint means in different devices..

Breakpoints ( from 900px to 1024px) (for laptops)

Media queries in CSS allow you to apply different styles based on specific conditions, such as screen size, device type, or orientation. This enables you to create responsive designs that adapt to various devices and viewport sizes.

Media queries help create responsive designs that adapt to different screen sizes and devices.

Media queries are used to apply styles for larger screens.

Responsive, it adjusts font sizes and line heights based on screen size.

@ media ( max-width: 900px) {
} ( this is for labtops, tablets that is 900px and below)

@ media ( min-width: 1000px) {
} ( these means for labtops 1000px and above)

@ media ( max-width: 550px) {
} ( this is for phones)