文档章节

html移动Web开发----优化浏览器视口宽度设置

g
 gethub_sl
发布于 2016/06/13 20:30
字数 215
阅读 32
收藏 1

 在移动设备上,要使移动设备无论竖屏还是横屏,都能使页面内容的宽度和设备的屏幕宽度相匹配,使文字易读性大大提高,我们可以按一下方法操作:

在<head>标签内添加<meta name="viewport" content="width=device-width">  由此使视口的宽度设置为匹配设备的宽度。

对于这个问题,一些较老版本的移动设备浏览器不能识别“viewport”,可以采用下面的方法:

在<head>标签内添加<meta name="HandheldFriendly" content="true">

对于微软的PocketPC,需要使用一个特别的“MoblieOptimized”属性:

<meta name="MoblieOptimized" content="320">

因此对于该问题最完整的解决方案的代码如下:

<meta name="viewport" content="width=device-width">

<meta name="MoblieOptimized" content="true">

<meta name="HandheldFriendly" content="320">

© 著作权归作者所有

共有 人打赏支持
g
粉丝 0
博文 22
码字总数 4460
作品 0
杭州
程序员
第118天:移动端开发——视口

移动端视口的分类说明。在开始之前,先看一个典型的例子: 1 2 @media screen and (max-width:480px){3 //宽度不超过480px时的样式 4 } 上述代码相信大家在做移动端开发时经常去书写。它研究...

半指温柔乐
2017/12/18
0
0
关于移动端的适配

写在前面 本文参考了大量关于移动端适配的资料 侵删 谢谢 基础介绍 在说明移动端的适配之前我们需要理解一个重要的东西 像素!! 像素 在移动端给一个元素设置时发生了什么?这里的px到底是多...

熊蛋子17
2017/12/31
0
0
PC端的viewport

视口 视口(viewport)的作用是限制元素,元素是所有网页块元素中最高一级的元素。 一个实际的例子。假设在一个流式布局中,你其中一个边栏的宽度是10%。现在当你改变浏览器宽度时,边栏会一...

金于虎
2016/10/27
5
0
理解移动端viewport

参考文档:Safari Web Content Guide 首先要弄清楚 三个视口 的概念,分别是:视觉视口、布局视口、理想视口 1.视觉视口 就是指用户的可见视野。 2.布局视口 或许你不知道'布局视口'这个概念...

小尾巴儿
2016/12/05
10
0
墙裂科普:移动端适配的基础概念

近几年移动端设备数量增长迅速,导致各种设备屏幕尺寸不一,分辨率也是不尽相同。 作为一个前端开发者,就不得不面对移动端页面适配的问题,而适配的终极目标,就是让页面能在不同尺寸,不同...

沃趣葫芦娃
07/02
0
0

没有更多内容

加载失败,请刷新页面

加载更多

linux使用ntfs-3g操作ntfs格式硬盘

Linux内核目前只支持对微软NTFS文件系统的读取。 NTFS-3G 是微软 NTFS 文件系统的一个开源实现,同时支持读和写。NTFS-3G 开发者使用 FUSE 文件系统来辅助开发,同时对可移植性有益。 安装 ...

linuxprobe16
今天
1
0
kubeadm部署kubernetes集群

一、环境要求 这里使用RHEL7.5 master、etcd:192.168.10.101,主机名:master node1:192.168.10.103,主机名:node1 node2:192.168.10.104,主机名:node2 所有机子能基于主机名通信,编辑...

人在艹木中
今天
7
0
Shell特殊符号总结以及cut,sort,wc,uniq,tee,tr,split命令

特殊符号总结一 * 任意个任意字符 ? 任意一个字符 # 注释字符 \ 脱义字符 | 管道符 # #号后的备注被忽略[root@centos01 ~]# ls a.txt # 备注 a.txt[root@centos01 ~]# a=1[root@centos01...

野雪球
今天
3
0
OSChina 周二乱弹 —— 程序员圣衣

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @达尔文:分享Skeeter Davis的单曲《The End of the World》 《The End of the World》- Skeeter Davis 手机党少年们想听歌,请使劲儿戳(这里...

小小编辑
今天
18
0
[ python import module ] 导入模块

import moudle_name ----> import module_name.py ---> import module_name.py文件路径 -----> sys.path (这里进行查找文件) # from app.web import Personimport app.web.Person as Pe......

_______-
昨天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部