响应式网站应设置的视口(viewPort)

Posted 艺术流

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了响应式网站应设置的视口(viewPort)相关的知识,希望对你有一定的参考价值。

代码:

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

 解释:

  • viewport(视口)是计算机或者设备屏幕上你浏览网页的内容宽度。
  • width=device-width 告诉浏览器以全尺寸渲染页面(不管屏幕尺寸可能是多少),如果没有在viewPort元数据属性中指定设备的宽度,设备将使用它自己默认的视口设置来渲染页面。
  • initial-scale(初始缩放比) 告诉浏览器在屏幕上首次加载网页的时候如何缩放它。使用initial-scale=1意味着页面将按照width属性确定的宽度来渲染,不放大不缩小。

请将上述代码添加到html head区域。

 

以上是关于响应式网站应设置的视口(viewPort)的主要内容,如果未能解决你的问题,请参考以下文章

移动开发与响应式网站

响应式布局

如何使响应式 html 表匹配视口初始比例 1.0

响应式设计

自适应设计与响应式网页设计

响应式布局