HTML5 meta标签的用法
声明文档使用的字符编码:
<meta charset="utf-8" />
声明文档的兼容模式:
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/> //指示IE以目前可用的最高模式显示内容
定义对页面的描述:
<meta name="description" content="HTML5COL学院提供高质量HTML5教学" />
定义页面的最新版本:
<meta name="revised" content="Frank, 2016/3/1" />
SEO 优化
页面描述
<meta name="description" content="不超过850个字符"/>
定义针对搜索引擎的关键词:
<meta name="keywords" content="HTML5COL学院, HTML5, CSS3, JavaScript" />
定义网页作者:
<meta name="author" content="HTML5COL" />
定义网页搜索引擎索引方式,使用英文逗号「,」分隔,常有如下几种取值:none,noindex,nofollow,all,index和follow:
<meta name="robots" content="index,follow" />
为移动设备添加 viewport
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
参数说明
content参数 释义
width viewport 宽度(数值/device-width)
height viewport 高度(数值/device-height)
initial-scale 初始缩放比例
maximum-scale 最大缩放比例
minimum-scale 最小缩放比例
user-scalable 是否允许用户缩放(yes/no)
ISO 设备
添加到主屏后的标题(iOS 6开始):
<meta name="apple-mobile-web-app-title" content="标题" />
设置状态栏的背景颜色:
<meta name="apple-mobile-web-app-title" content="yes" />
是否启用 WebApp 全屏模式:
<meta name="apple-mobile-web-app-capable" content="yes" />
设置状态栏的背景颜色:
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
注:只有在 "apple-mobile-web-app-capable" content="yes" 时生效
content 参数:
content参数 释义
default 默认值,网页内容从状态栏底部开始
black 状态栏背景是黑色,网页内容从状态栏底部开始
black-translucent 状态栏背景是黑色半透明,网页内容充满整个屏幕,顶部会被状态栏遮挡
Windows 8
Windows 8 磁贴颜色:
<meta name="msapplication-TileColor" content="#000" />
Windows 8 磁贴图标:
<meta name="msapplication-TileImage" content="icon.png" />
其他
禁止数字识自动别为电话号码:
<meta name="format-detection" content="telephone=no" />
不让android识别邮箱:
<meta name="format-detection" content="email=no" />
每 8 秒刷新一次页面:
<meta http-equiv="refresh" content="8" />
HTML5 meta标签的用法的更多相关文章
- 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理
[微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...
- Html5新标签及用法
HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要插件的丰富性网络应用服务( ...
- html中meta标签及用法理解
自己一直想成为高级前端开发工程师,而自学.奈何最近感觉自学收效甚微,一度迷茫. 不破不立,打算改变这样的状态. 春节后上班第一天,今年打算好好实现自己的前端梦想. 重新整理.总结前端技术. 废话,就不 ...
- meta标签的用法
meta是用来在HTML文档中模拟HTTP协议的响应头报文.meta 标签用于网页的<head>与</head>中,meta 标签的用处很多.meta 的属性有两种:name和 ...
- HTML meta标签的用法及head中的一些常用标签
meta是用来在HTML文档中模拟HTTP协议的响应头报文.meta主要为分HTTP标头信息(HTTP-EQUIV)和页面描述信息(NAME)标头信息包括文档类型.字符集.语言等浏览器正确显示网页的信 ...
- html5 meta标签的认知储备
在开发移动或者PC端的时候除了'<meta charset="UTF-8">'这个设置编码格式的meta标签,还有一些其他方面的设置 一.<meta name=& ...
- meta标签多种用法
<meta name=”google” content=”notranslate” /> <!-- 有时,Google在结果页面会提供一个翻译链接,但有时候你不希望出现这个链接,你可 ...
- HTML5 <meta> 标签属性,所有meta用法都在这里了
基本标签SEO 优化为移动设备添加 viewportWindows 8其他 禁止数字识自动别为电话号码不让android识别邮箱每 8 秒刷新一次页面移动端的头部标签和meta 基本标签 声明文档使用 ...
- HTML5 <meta> 标签属性,所有meta用法
基本标签 声明文档使用的字符编码:<meta charset="utf-8" /> 声明文档的兼容模式:<meta http-equiv="X-UA-C ...
随机推荐
- ASP.NET CORE 项目搭建(2022 年 3 月版)
ASP.NET CORE 项目搭建(2022 年 3 月版) 自读 沉淀了多年的技术积累,在 .NET FRAMEWORK 的框架下尝试造过自己的轮子. 摸索着闭门造过 基于 OWIN 服务后端. 摸 ...
- LGP3709题解
题目大意 简化后为区间众数出现次数,简化前为[数据删除] 吐槽 为什么题解只有一篇分块,剩下的全是莫队? 这题不是蒲公英?这和算导例题有何区别??? 为什么现在的人都喜欢去看题解而不注重思维??? 莫 ...
- 机器学习之BP神经网络
import random import math #神经元的定义 class Neuron: def __init__(self,bias): self.bias = bias self.weigh ...
- 5分钟了解Redis的内部实现快速列表(quicklist)
快速列表简介 在Redis3 .2版本之前,存储列表(list)数据结构使用的是压缩列表(ziplist)和链表(linkedlist),当列表元素个数比较少并且每个元素占用空间比较小的时候,使用压缩 ...
- 张高兴的 Entity Framework Core 即学即用:(一)创建第一个 EF Core 应用
写在前面 Entity Framework Core (EF Core) 是 .NET 平台流行的对象关系映射(ORM)框架.虽然 .NET 平台中 ORM 框架有很多,比如 Dapper.NHibe ...
- org.junit.platform.commons.JUnitException: TestEngine with ID 'junit-jupiter' failed to discover tests
https://blog.csdn.net/qq_43349162/article/details/115285780 https://blog.csdn.net/Think_and_work/art ...
- spring——通过注解显式的完成自动装配
构建bean文件: public class People { private String name = "小明"; } 编写配置类: @Configuration @Impor ...
- Spring——初识
1.1 使用 导包:Spring Web MVC(maven) <!-- https://mvnrepository.com/artifact/org.springframework/sprin ...
- AVRmega16 LED 例程
AVRmega16 LED 例程 ...
- APIO2015 八邻旁之桥/巴邻旁之桥
题目描述: bz luogu 题解: 贪心+权值线段树. $K=1$的时候,答案为$\sum |x-l| + |x-r|$,所以所有端点排序后取中位数即可. $K=2$的时候,一定是左边的一些走左边的 ...