A media query consists of a media type and at least one query that limits style sheets using media characteristics such as width, height, and color. It is understood as a CSS3 module that allows adapting the representation of the content to the characteristics of the device.
Added in CSS3, media queries allow the presentation of content to adapt to a specific range of output devices without having to change the content itself. It is what is called in English a responsive design, that is, it adapts to each device according to the size of the screen.
A media query consists of a media type and at least one query that limits style sheets using media characteristics such as width, height, and color. It is understood as a CSS3 module that allows adapting the representation of the content to the characteristics of the device.
Added in CSS3, media queries allow the presentation of content to adapt to a specific range of output devices without having to change the content itself. It is what is called in English a responsive design, that is, it adapts to each device according to the size of the screen.
Media queries consist of a media type, represented in CSS by @media and one or more expressions, implying characteristics of the media, which resolve to true or false. The query result is true if the media type specified in the media query matches the type of device being displayed and all expressions in the media query are true.
Queries are case insensitive. Media queries containing unknown media types will always return false.
Like any other style element, media queries can be used in an <link /> element, which will refer to a file with a .css extension:
<!-- CSS media query un elemento link --> <link rel="stylesheet" media="(max-width: 800px)" href="example.css" />Or directly, without going through the link element:
<!-- CSS media query within a style sheet --> <style> @media (max-width: 600px) { .facet_sidebar { display: none; } } </style>