当我在meta标签中定义content =“ max-width = 1200px;”时，媒体查询的工作方式

Question

How media queries are work when i define in meta tag content="width=1200px;" And my media queries are like

@media (max-width:480px){}
@media (max-width: 600px) {}

and etc. other media queries.

Answer 1

content="width=1200px" means your layout needs at least 1200 pixels of width.

For pages that set an initial or maximum scale, this means the width property actually translates into a minimum viewport width.

For example, if your layout needs at least 500 pixels of width then you can use the following markup. When the screen is more than 500 pixels wide, the browser will expand the viewport (rather than zoom in) to fit the screen:

<meta name="viewport" content="width=500, initial-scale=1">

https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag http://www.allenpike.com/2010/choosing-a-viewport-for-ipad-sites/