视口和响应式Web之间的区别

时间:2015-08-19 10:33:21

标签: html css responsive-design viewport

我想知道使用CSS媒体屏幕的<meta name='viewport'>和响应式网页设计之间有什么区别?

因为这两件事在功能上似乎相似。

有或没有<meta name='viewport'>,只需设置媒体屏幕,我仍然可以为不同的屏幕尺寸设置不同的布局,布局会自动检测屏幕尺寸,然后设置匹配的布局

2 个答案:

答案 0 :(得分:0)

视口元标记几乎使用了其他一些选项:

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

通过这些选项,您可以为响应式网站定义一些行为。使用<meta name='viewport'>没有其选项对您的网站没有任何特殊影响,尽管它仍然可以响应。

您可以查看此页面以获取更多信息:
https://css-tricks.com/snippets/html/responsive-meta-tag/

答案 1 :(得分:0)

<meta name="viewport">告诉浏览器小屏幕如何将CSS像素映射到真实像素上。基本上就是说&#34;我们打算关心手机大小的屏幕,不要缩小&#34;到浏览器。

这是(理智地)实施响应式网页设计的先决条件,而不是替代方法。