工作需要,要做一个手机自适应的网页效果,终于搞定,先分享并记录!

其实主要就是改掉HTML页面声明:

在网页中加入以下代码,就可以正常显示了:

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

解释:

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

精简点的话,可以把上面的代码更改为以下代码,效果是一样的:

<meta content="width=device-width,user-scalable=no" name="viewport">

最后就是不要设置太大的具体宽度属性了,比如你在网页把Body的宽度属性设为1000px,这肯定是不行的了,但是可以设置为90%,这是屏幕自适应的。

页面来自:http://www.cnblogs.com/yc-755909659/p/3605214.html

手机网页Html代码实现(解决显示页面很小的问题)的更多相关文章

  1. 【问题&解决】手机网页Html代码实现(解决显示页面很小的问题)

    工作需要,要做一个手机自适应的网页效果,终于搞定,先分享并记录! 其实主要就是改掉HTML页面声明: 在网页中加入以下代码,就可以正常显示了: <meta name="viewport ...

  2. HTML5做手机站页面字体显示很小的解决方法

    HTML5做手机站需要加上一部分代码,不然字体会显示很小的,经历了很久的不解才发现的,希望给大家一些帮助 <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD ...

  3. 用手机自带uc浏览器查看静态页面,css样式不显示

    问题描述: 这个问题是一个同事在写手机页面用UC浏览器测试以后遇到的,其他浏览器静态页面显示正常,唯独UC浏览器不显示页面样式. 我测试过代码是没有问题的,因为临时没有找到安卓手机,就猜想PC端的应该 ...

  4. thinkphp从数据库里的html代码显示页面不解析

    首先,这个问题不应该出现在这里,因为以前在用ThinkPHP3.1.2的时候,利用富文本编辑器保存文本后,直接从数据库里面取出的数据都能正常显示,改用ThinkPHP3.2.3之后,thinkphp从 ...

  5. AngularJS进阶(二十八)解决AngualrJS页面刷新导致异常显示问题

    解决AngualrJS页面刷新导致异常显示问题 绪 俗话说,细节决定成败,编程亦是如此.编程过程中我们可能会不自觉的忽视一些细节问题,殊不知,这些细节正是导致页面显示出现问题的地方.今略举一例,与君共 ...

  6. 三行代码实现.NET MVC统计显示页面的执行时间 超简单的实现方法 分析页面执行效率

    三行代码实现.NET MVC统计显示页面的执行时间 超简单的实现方法 分析页面执行效率    博客页脚处添加了页面执行时间统计显示,如下图所示,也可以直接查看网页页脚处. 实现方法非常简单,只需三行代 ...

  7. 关于Hexo,Next主题的‘下一页’、‘上一页’按钮错误显示为html代码 的解决方法

    关于Next主题的'下一页'.'上一页'按钮错误显示为html代码的解决方法 我在建立自己的博客过程中遇到了页面'下一页'和'上一页'按钮显示为html代码<i class="fa f ...

  8. 分页复用代码【Page类、JSP显示页面】

    前言 为了复用,记载一些以前写过的工具类.方法 page类 import java.util.List; /** * Created by ozc on 2017/3/1. */ public cla ...

  9. mp4网页播放代码,有声音无图像的解决办法~

    mp4网页播放代码,有声音无图像的解决办法~     关于网页播放mp4格式的视频,找了一些插件,这里推荐一下video.js 官方网址:http://www.videojs.com/ github ...

随机推荐

  1. Javascript:JSON总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它是基于ECMAScript的一个子集,采用完全独立于语言的文本格式.这些特性使JSON成为理想的数据交换 ...

  2. 常用C#关键字详解教程

    很多在学习网站后台的同学都对C#的关键字有些摸不到头脑,现在就和大家一起学习一下这些关键字的含义 类型 Void 用作方法的返回类型时,void 关键字指定方法不返回值. 在方法的参数列表中不允许使用 ...

  3. C#中==、Equals、ReferenceEquals的区别

    原文链接:http://www.studyofnet.com/news/1188.html 本文导读: C#中Equals , == , ReferenceEquals都可以用于判断两个对象的个体是不 ...

  4. input checkbox 扩大点击范围

    <div style="width:100%;height:100px;"><input type="checkbox" onclick=&q ...

  5. HTML5学习笔记四 HTML文本格式化

    HTML 格式化标签 HTML 使用标签<b> 与<i> 对输出的文本进行格式, 如:粗体 or 斜体 这些HTML标签被称为格式化标签 通常标签 <strong> ...

  6. Touch ID使用

    前言:如果图片看不了请移步:简书 Touch ID简介 Touch ID指纹识别作为iPhone 5s上的"杀手级"功能早已为人们所熟知,目前搭载的设备有iphone SE.iPh ...

  7. IOS开发基础知识--碎片39

    1:UIWindow知识点 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDict ...

  8. Android开发的小技巧,在Android Studio中使用Designtime Layout Attributes

    在编写xml文件时,为了预览效果,经常会使用默认填上一些内容,比如TextView时,随便写上一个text <TextView ... android:text="Name:" ...

  9. 12-返回指针的函数&&指向函数的指针

    前言 接下来我只讲指针的最常见用法,比如这一章的内容----返回指针的函数 与 指向函数的指针   一.返回指针的函数 指针也是C语言中的一种数据类型,因此一个函数的返回值肯定可以是指针类型的. 返回 ...

  10. BitSet构造函数的两种特例

    C++11之后,bitset的构造函数新加了两种形式: bitset<bits>::bitset (const string& str, string::size_type str ...