Can anyone explain me @media topic in css

HTML-CSS
1

I did not understand what @media does in css . can anyone explain me the topic . If possible I am ready for video session .

Thanks,
Ruthvik

2

the goal of media queries are to apply certain CSS rules only when the browser/viewport/device fits a certain condition.

An example would be you want a nav menu with each link stacked on top of each other, when the user uses a browser dimension that has a width of 400 px or less. If its 400 px or more, the nav menu has its children links side by side.

Here’s some reading on media queries

3

There are plenty of resources on the topic, just search for it.

Media Query Basics

The simplest media query syntax looks like this:

@media media-type and (media-feature-rule) {
  /* CSS rules go here */
}

It consists of:

  • A media type, which tells the browser what kind of media this code is for (e.g. print, or screen).
  • A media expression, which is a rule, or test that must be passed for the contained CSS to be applied.
  • A set of CSS rules that will be applied if the test passes and the media type is correct.
1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.