移动端——meta标签
meta标签主要辅助HTML结构层的。meta标签不管在互联网前端还是在移动端都起了很重要的作用。
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
这是一个HTML5为语言标准的说明文档。
1、第一组meta标签,比较常见。它表明的意思是它的内容是html文档,且网页编码采用的是utf-8编码。utf-8编码主要针对是简体中文和英文。正确的编码定义很有必要。否则会导致网页上的文字变成乱码。
2、第二组meta标签就是移动端特属的标签了。
意思是它是一个视图窗口,其视图窗口内容的宽度等于移动端设备的默认宽度;inital-scale表示的初始的缩放比例,一般设置为1.0倍;maximum-scale=1.0表示的允许用户缩放的最大比例;user-scalable=no表示支持用户手动进行页面缩放。
3、第三、四组meta标签都是针对IOS系统的专属标签。
3.1 第三组意思是是否启动 webapp功能,就是当点击网页添加至主屏幕功能时,会在主屏幕上生成一个图标,点击该图标会进入webapp功能,就是模拟本地应用的模式来浏览web页面。
生成的图标可以自定义,启动webapp时的开始时的图片也可以定义,这个是link标签的作用,在后续介绍标签时单独说明。
3.2 第四组表示的是当启动 webapp功能时,显示手机信号、时间、电池的顶部导航栏的颜色。
默认值为 default (白色),可以定为 black (黑色)和 black-translucent (灰色半透明)。具体值根据实际页面设计的主题色搭配进行设置。
移动端——meta标签的更多相关文章
- 移动端meta标签设置
移动端meta标签设置 1.设置当前html文件的字符编码 <meta charset="UTF-8"> 1 2设置浏览器的兼容模式(让IE使用最新的浏览器渲染) &l ...
- 移动端meta标签整理-备
分类 在介绍移动端特有 meta 标签之前,先简单说一下 HTML meta 标签的一些知识. meta 标签包含了 HTTP 标题信息 (http-equiv) 和 页面描述信息 (name). h ...
- PC端meta标签
下面介绍meta标签的几个属性,charset,content,http-equiv,name. 一.charset 此特性声明当前文档所使用的字符编码,但该声明可以被任何一个元素的lang特性的值覆 ...
- 移动端 :meta标签1万个作用
meta标签 <meta charset="utf-8"> <meta http-equiv="Content-Type" content=& ...
- 移动端 meta 标签笔记
(转自http://www.cssue.com/xhtml-css/html5-css3/mobile-meta.html,版权归原作者所有!) 移动平台对 meta 标签的定义 一.meta 标签分 ...
- 移动端meta标签
现在的手机或平板电脑等移动设备上的浏览器默认都有双击放大的设置,如何阻止双击放大?user-scalable=no <!-- 禁止缩放 --> <meta name=”viewpor ...
- 移动端meta标签缓存设置
1.<meta charset="utf-8"> 2.<meta content="width=device-width, initial-scale= ...
- 移动端meta标签的使用和设置
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale= ...
- 移动端meta标签的设置
var phoneWidth = parseInt(window.screen.width); var phoneScale = phoneWidth / 640; var ua = navigato ...
随机推荐
- NPOI 实现在已存在的Excel中任意位置开始插入任意数量行,并填充数据
1 npoi版本2.1.3.1 2 需要添加的引用: using NPOI.SS.UserModel;using NPOI.XSSF.UserModel;using System.IO;using N ...
- 安卓开发之sql语句增删改查2(利用谷歌封装好的API进行增删改查)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...
- DX使用随记--其他
1. 百分号显示格式 百分号:{0:P}表示显示为百分号模式.如数据源中为0.5.表示出来为50%
- ASE19团队项目alpha阶段model组 scrum5 记录
本次会议于11月7日,19时整在微软北京西二号楼sky garden召开,持续12分钟. 与会人员:Jiyan He, Kun Yan, Lei Chai, Linfeng Qi, Xueqing W ...
- oracle内核参数详解
一.前言 在生产中,我们安装oracle数据库时,为达到最优我们需要对操作系统的内核参数进行一定的调整.主要从内存.cpu.io以及网络等方面,根据实际情况进行调整.以下参数可供大家参考,如有不当之处 ...
- Sql 语法练习
select * from Student select * from Class select * from Score select * from Subject --1.查询出和张三住在同一个地 ...
- 第2章 python入门
基本数据类型(int, bool, str) 1.1 python基本数据类型 1.int ==> 整数. 主要⽤来进⾏数学运算 2.str ==> 字符串 可以保存少量数据并进⾏相应的操 ...
- Java&Selenium&JS&AWT之那些难以点击到的按钮
一.摘要 本篇博文的重点并不是简单的click()方法,而是要讲的是那些click()方法失效的时候的处理方式,其实做自动化久了我们都能发现研发的代码并不是都那么美丽,selenium支持的8种定位方 ...
- vmware添加新硬盘磁盘扫描脚本
#! /bin/bash echo "- - -" > /sys/class/scsi_host/host0/scan echo "- - -" > ...
- PHP即时通讯设计实现
详解即时通讯设计实现(PHP+GatewayWorker+Redis) 需要实现的功能 一对一聊天(私聊) 一对多聊天(群聊) 类似QQ,微信等聊天列表 实时消息 显示 工具选择 GatewayWor ...