media query max-width relates to the view port siz

2019-04-07 03:51发布

I'm wondering if the max-width of a media query is relates to the view port size or the windows size?

for example , I have this media query:

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

will this media query be in action when the view port size is 360px or the windows size 360px?

1条回答
仙女界的扛把子
2楼-- · 2019-04-07 04:26

It's the viewport. This is stated in the spec:

The ‘width’ media feature describes the width of the targeted display area of the output device. For continuous media, this is the width of the viewport (as described by CSS2, section 9.1.1 [CSS21]) including the size of a rendered scroll bar (if any).

This also applies to sub-viewports within the main browser viewport, such as those of framesets and iframes. So if an iframe has a width of 360px or less, your media query will also apply within that iframe.

查看更多
登录 后发表回答