Understand the basics of Media Queries

Hello Guys

Today we understand the basics of media query. All websites which is works online have four major screen ie
1.Large desktop screen 
2.Medium desktop screen
3.Ipad screen {768px width - 1024px}
4.Mobile screen { less than 768px}

Take an example:-
@media screen and (min-width: 768px) and (max-width: 979px) {...}
This media query will work between 768px width to 979 width only.

Now take an another example of max width media query ie:

@media screen and (max-width: 980px) {...}

This media works only in 980px screen size or less than 980px screen size. This media query is more effective than above media query in which we set min-width and max-width.

This media query also decrease the lines of css.