web端网站转移至移动端页面，注意点如下：

1.首先引入viewport调整页面宽度

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

2.css中1px并不等于设备的1px

3.导图

原文转自：http://www.cnblogs.com/2050/p/3877280.html

http://weizhifeng.net/viewports.html

　　　　　　 http://weizhifeng.net/viewports2.html

【转】移动端viewport的使用的更多相关文章

  1. 移动端viewport解惑

    我们在做移动端webapp的时候需要设置这么一段: <meta name="viewport" content="width=device-width, initi ...

  2. 移动端Viewport & 使用rem来开发移动端网站

    Viewport大神 无双 的精彩解释 具体参数各型号是否支持参见: http://www.cnblogs.com/2050/p/3877280.html#commentform 摘录: 移动设备上的 ...

  3. 移动端 viewport设置

    <meta name="viewport" content="" /> width [pixel_value | device-width] wid ...

  4. 移动端viewport模版

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta cont ...

  5. [总结]CSS/CSS3常用样式与web移动端资源

    CSS/CSS3常用样式与知识点 IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条 ...

  6. 你可能不知道的viewport

    概述 前几天偶然看到一个pc端网页,发现用手机打开竟然同比缩放了,作为一个前端从业者,我自然想要弄清它到底是怎么缩放的.之后查了它的meta信息,css和js,发现没有任何兼容手机端的代码,那它到底是 ...

  7. web前端之移动端：知识汇

    移动前端自适应适配方法总结 移动端前端适配方案(总结) -- 面试重点 不要再问我移动适配的问题了 一.响应式布局: // Extra small devices (portrait phones, ...

  8. web开发中移动端适配

    这个话题有些复杂,说起来有些琐碎,因为和移动端适配相关的问题太多了. 1. 概念 1.1 设备像素 设备像素被称为物理像素,它是显示设备中一个最小的物理部件.每个像素可以根据操作系统设置自己的颜色和亮 ...

  9. 深入浅出 Viewport 设计原理

    Viewport 是 HTML5 针对移动端开发新增的一个 meta 属性, 它的作用是为同一网页在不同设备的呈现,提供响应式解决方案.这篇文章尝试通过循序渐进的方式,逐层探索 Viewport 的设 ...

随机推荐

  1. 有关RAVE报表 - 大富翁论坛20050419

    部分资料来源于RAVE开发人员指南 ravedevguide5 新闻组News.Nevrona.com RAVE的官方主页  www.nevrona.com/rave KeyLife富翁笔记  作者 ...

  2. MVC4.0中项目发布遇到IE11时session存入URL中，导致记不住密码的问题

    ///MVC4.0中项目发布遇到IE11时session存入URL中,导致记不住密码的问题,在webconfig中配置<system.web><authentication mode ...

  3. Image zImage uImage

    内核编译(make)之后会生成两个文件,一个Image,一个zImage,其中Image为内核映像文件,而zImage为内核的一种映像压缩文件,Image大约为4M,而zImage不到2M. 那么uI ...

  4. Ubuntu14.04安装MySQL-python异常： mysql_config: not found,Command "python setup.py egg_info" failed with error code 1 in /tmp/pip-build-MJWMPd/MySQL-python/

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAABUoAAAE8CAIAAACZ6RwMAAAgAElEQVR4nOydaVxTx9fHn9dhKWqltv

  5. Python自动化 【第八篇】：Python基础-Socket编程进阶

    本节内容: Socket语法及相关 SocketServer实现多并发 1. Socket语法及相关 sk = socket.socket(socket.AF_INET,socket.SOCK_STR ...

  6. makefile学习小结

    =============2016/08/15================ 上午完成makefile的试验,缩短了代码量,现在make强大,有缺省的变量,能自己推导关系,不需要gcc –MM -M ...

  7. 在SWING里嵌入SWT的组件

    http://zhanghan3366.blog.163.com/blog/static/6966305220110505351568/ ——————————————————————————————— ...

  8. DIOCP之注册编码解码器与ClientContext

    FTcpServer.registerCoderClass(TIOCPStreamDecoder, TIOCPStreamEncoder);//注册编码器与解码器 FTcpServer.registe ...

  9. 为Elasticsearch添加中文分词，对比分词器效果

    http://keenwon.com/1404.html Elasticsearch中,内置了很多分词器(analyzers),例如standard (标准分词器).english(英文分词)和chi ...

  10. Servlet 利用Cookie实现一周内不重复登录

    import java.io.IOException;import java.io.PrintWriter; import javax.servlet.ServletException;import ...