`
jinyanhui2008
  • 浏览: 319317 次
  • 性别: Icon_minigender_1
  • 来自: 青岛
社区版块
存档分类
最新评论

meta viewport属性含义

 
阅读更多

 

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

其中:
width - viewport的宽度
height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放

 

 

http://stackoverflow.com/questions/6389793/jquery-mobile-pages-super-large-in-safari-mobile


分享到:
评论

相关推荐

    meta viewport标签的使用说明(手机浏览缩放控制)

    meta viewport标签是用于控制移动设备上网页显示效果的HTML标签,它位于网页头部head区域,可以影响移动浏览器的视口(viewport)行为,主要控制页面的宽度、初始缩放比例、缩放的最小与最大比例以及是否允许用户...

    自适应布局meta标签中viewport、content、width、initial-scale、minimum-scale、maximum-scale总结

    在meta标签中,width属性有两个含义:一是phys.width,二是虚拟窗口的width。例如,使用meta name="viewport" content="width=device-width"时,width既可以是phys.width,也可以是虚拟窗口的width。这样就会出现两...

    图文并茂让你必须弄懂viewport配套示例代码.rar

    表明这个教程的核心内容是关于如何在HTML和CSS中设置和管理视口,包括但不限于`&lt;meta name="viewport" content="..."&gt;`标签的使用,以及其属性如width、initial-scale、minimum-scale、maximum-scale等的含义和配置...

    html中meta标签及用法详解

    一、meta标签 含义  &lt;meta&gt; 元素 可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。  &lt;meta&gt; 标签位于文档的头部,不包含任何内容。  &lt;meta&gt; 标签的...

    HTMLMETA标签.pdf

    - &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; 在不同的DTD中,如"Strict", "Transitional", 和"Frameset",&lt;meta&gt;标签的使用可能略有不同,主要是因为它们针对不同的HTML版本(XHTML...

    html5 viewport使用方法示例详解

    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"&gt; ``` 其中各个参数的含义如下: 1. **width** - 控制视口的宽度。通常推荐设置为`device-width`,...

    通过viewport实现jsp页面支持手机缩放

    这个`&lt;meta&gt;`标签的各个属性含义如下: 1. `width=device-width`: 这个设置告诉浏览器,viewport的宽度应该等于设备的宽度。这样可以让页面的宽度与设备屏幕相匹配,避免出现水平滚动条。 2. `initial-scale=1.0`:...

    移动端适配+响应式开发参考代码

    meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" &gt; 这段js的传入两个参数:一个为设计稿实际宽度,一个为显示的最大宽度(允许的屏幕最大宽度,用来...

    重要知识HTML5head头标签.pdf

    例如,`&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;`使得网页宽度适应设备屏幕宽度,并设置初始缩放比例。 8. **其他元标签**: - `&lt;link rel="stylesheet" href="style.css"&gt;`引入...

    2020年web前端最全面试题及答案【含vue,react】[整理].pdf

    - `&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;`为移动设备设置视口。 - `&lt;meta http-equiv="refresh" content="秒数;URL=新网址"&gt;`实现页面自动跳转。 - `&lt;meta name="description" ...

    HTML head 头标签详细介绍

    例如,`&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;`确保页面宽度适应设备屏幕,并设定初始缩放比例。 语言属性`lang`用来指定文档的语言,如`&lt;html lang="zh-cmn-Hans"&gt;`表示简体...

    wap手机端登录html模板下载

    在响应式设计方面,HTML5引入了`&lt;meta name="viewport"&gt;`标签,允许开发者精确控制页面在不同尺寸设备上的展示方式。通过设置`width`和`initial-scale`等属性,我们可以让登录界面在各种手机屏幕上都能自适应调整...

    Html面试题拍照版.zip

    12. **响应式设计**:HTML5的`&lt;meta name="viewport"`标签结合CSS3媒体查询,可实现页面在不同设备上的自适应布局。 13. **HTML5新特性**:包括离线存储`Application Cache`、拖放功能`drag and drop`、画布`...

    accp5.0 S1 HTML 1-7章

    9. **响应式设计**:在HTML5中,`&lt;meta&gt;`标签的`viewport`属性和CSS3媒体查询允许我们创建适应不同设备屏幕的响应式网页。 10. **注释**:`&lt;!-- --&gt;`用于插入HTML注释,对代码进行解释,便于理解和维护。 11. **...

    HTML语言从零到精通.zip

    10. **头部元素**:中的定义网页标题,&lt;meta&gt;标签处理元数据,如字符编码(charset)和视口设置(viewport)。 11. **CSS基础**:虽然不是HTML本身的一部分,但CSS(Cascading Style Sheets)是与HTML紧密相关的,...

    HTML时尚编程百例(代码)

    结合`&lt;meta&gt;`的`viewport`属性,可实现跨平台兼容的响应式网页。 8. **框架与布局** `&lt;iframe&gt;`元素可以嵌入其他网页,`&lt;header&gt;`、`&lt;nav&gt;`、`&lt;main&gt;`、`&lt;footer&gt;`等语义化标签有助于构建更清晰的页面结构。`...

    浅谈移动端的自适应布局问题(响应式、rem/em、Js动态)

    在响应式设计中,通常在HTML文档的部分使用&lt;meta&gt;标签的viewport属性,以确保页面宽度与设备屏幕宽度一致,并禁用用户缩放,从而控制页面在移动设备上的显示效果。具体的viewport属性设置为: &lt;meta name="viewport...

    2021前端面试题精编.pdf

    `&lt;meta name="viewport"&gt;`标签用于指定视口属性,这样可以控制布局在移动设备上的显示方式。常见的`viewport`设置是`&lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;`,其中`width=device-...

    HTML+CSS基础讲解

    5. 响应式设计:HTML5引入了`&lt;meta name="viewport"&gt;`标签,帮助适应不同设备的屏幕尺寸。 二、CSS基础 1. 选择器:CSS通过选择器来定位HTML元素,如类选择器`.class`,ID选择器`#id`,标签选择器`element`,以及...

Global site tag (gtag.js) - Google Analytics