Have you ever wondered how a web page adjusts itself on different screen sizes and why it looks a bit different on different web pages, so let me tell you all these don't take place automatically, properties are set by the developers how a web page will look on different screen sizes and it is done with the help of media query.
Media query is used in CSS using the @media keyword -:
Syntax -:
@media (width: value)
{
style
}
whatever we will write inside the width the style will be applicable to that width we can set style even for a range of widths...
Use of media query-:
Makes the web page responsive
Increases the user interface and experience
Makes a website more portable and easy to use and hence increases the traffic on a website.
Thanks...