搜索
首页web前端html教程HTML5的WEB界面中meta实列详解

这次给大家带来HTML5的WEB界面中meta实列详解,使用HTML5的WEB界面中meta的注意事项有哪些,下面就是实战案例,一起来看一下。

简介

meta标签是HTML语言HEAD区的一个辅助性标签。

meta常用于定义页面的说明,关键字,最后修改日期,和其它的元数据。这些元数据将服务于浏览器(如何布局或重载页面),搜索引擎和其它网络服务。

mata 标签包含全局属性

charset

声明网页的字符编码:

content

content属性的内容是 htp-equiv或 name属性的值,具体取决于你用哪一个。

http-equiv

该属性可以包含HTTP头的名称,属性的英文全称为 http-equivalent。它定义了可以改变 server和 user-agent行为的指令。该指令的值在content属性内定义,可以是以下之一:

content-language(已过时)

定义页面的默认语言。它可以被任何元素上的lang属性所覆盖。

Pragma

禁止浏览器从本地计算机的缓存中访问页面内容。如:

expires

可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。

cache-control

指定请求和响应遵循的缓存机制。共有以下几种用法:

no-cache: 先发送请求,与服务器确认该资源是否被更改,如果未被更改,则使用缓存。
no-store: 不允许缓存,每次都要去服务器上,下载完整的响应。(安全措施)
public : 缓存所有响应,但并非必须。因为max-age也可以做到相同效果
private : 只为单个用户缓存,因此不允许任何中继进行缓存。(比如说CDN就不允许缓存private的响应)
max-age : 表示当前请求开始,该响应在多久内能被缓存和重用,而不去服务器重新请求。例如:max-age=60表示响应可以再缓存和重用 60 秒。

content-security-policy

允许页面作者定义当前页面的内容策略。内容策略主要指定允许的服务器地址和脚本端点,这有助于防止 cross-site scripting 攻击。

CSP 的实质就是白名单制度,开发者明确告诉客户端,哪些外部资源可以加载和执行,等同于提供白名单。它的实现和执行全部由浏览器完成,开发者只需提供配置。

CSP 大大增强了网页的安全性。攻击者即使发现了漏洞,也没法注入脚本,除非还控制了一台列入了白名单的可信主机。 两种方法可以启用 CSP。一种是通过 HTTP 头信息的 Content-Security-Policy的字段。

Content-Security-Policy: script-src 'self'; object-src 'none';

style-src cdn.example.org third-party.org;child-src https:


   


上面代码中,CSP 做了如下配置:

脚本:只信任当前域名
标签:不信任任何URL,即不加载任何资源
样式表:只信任 cdn.example.org和 third-party.org
框架(frame):必须使用HTTPS协议加载
其他资源:没有限制
启用后,不符合 CSP 的外部资源就会被阻止加载。

更多介绍可见:Content Security Policy 入门教程

content-type(已过时)

定义文档的MIME类型,后跟其字符编码。

不要使用这个值,因为它已经过时了。推荐使用元素上的charset属性。
由于无法在XHTML或HTML5的XHTML序列化中更改文档类型,因此不要使用将MIME类型设置为 XHTML MIME类型。
refresh

该指令指定:

如果content属性只包含一个正整数,则表示该页面重新加载的秒数。
如果content属性包含一个正整数,后跟字符串'; url =',那么表示当前页面XX秒后重定向到另一个有效的URL。

robots

robots用来告诉爬虫哪些页面需要索引,哪些页面不需要索引。



Used By


index    允许robot索引本页面(默认)    All    

noindex    不允许robot索引本页面    All    

follow    允许搜索引擎继续通过此网页的链接索引搜索其它的网页(默认)    All    

nofollow    搜索引擎不继续通过此网页的链接索引搜索其它的网页    All    

none    相当于noindex,nofollow    Google    

noodp    禁止使用Open Directory Project描述(如果有的话)作为搜索引擎结果中的页面描述。    Google, Yahoo, Bing    

noarchive    要求搜索引擎不缓存页面内容    Google, Yahoo, Bing    

nosnippet    禁止在搜索引擎结果中显示该页面的任何描述。    Google, Bing    

noimageindex    要求此页面不作为引用页面的索引图像的显示。    Google    

nocache    和noarchive同义    Bing    

viewport

提供了关于viewport初始大小的大小的提示。仅供移动设备使用。

相信看了这些案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

相关阅读:

怎样在HTML网页中插入视频

怎样做出HTML文本框只读效果

怎样让前端界面自动清理js、css文件的缓存

以上是HTML5的WEB界面中meta实列详解的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
HTML标签和元素是同一件事吗?HTML标签和元素是同一件事吗?Apr 28, 2025 pm 05:44 PM

文章解释说,HTML标签是用于定义元素的语法标记,而元素是完整的单位,包括标签和内容。他们一起工作以构建网页。查拉克计数:159

< head>的意义是什么。 &<身体>在html中标记?< head>的意义是什么。 &<身体>在html中标记?Apr 28, 2025 pm 05:43 PM

本文讨论了Lt; Head> &<身体> HTML中的标签,它们对用户体验的影响以及SEO的影响。正确的结构增强了网站功能和搜索引擎优化。

< strong>,lt; b>有什么区别标签和lt; em>,< i>标签?< strong>,lt; b>有什么区别标签和lt; em>,< i>标签?Apr 28, 2025 pm 05:42 PM

本文讨论了HTML标签,和和关注其语义与表现用途及其对SEO和可访问性的影响之间的差异。

请说明如何指示HTML中文档使用的字符集?请说明如何指示HTML中文档使用的字符集?Apr 28, 2025 pm 05:41 PM

文章讨论了在HTML中指定字符,重点介绍了UTF-8。主要问题:确保正确显示文本,防止乱七八糟的字符,并增强SEO和可访问性。

HTML中的各种格式标签是什么?HTML中的各种格式标签是什么?Apr 28, 2025 pm 05:39 PM

本文讨论了用于构建和造型Web内容的各种HTML格式标签,强调了它们对文本外观的影响以及语义标签对可访问性和SEO的重要性。

HTML元素的' ID”属性与'类”属性之间有什么区别?HTML元素的' ID”属性与'类”属性之间有什么区别?Apr 28, 2025 pm 05:39 PM

本文讨论了HTML的“ ID”和“类”属性之间的差异,重点是它们的独特性,目的,CSS语法和特异性。它解释了它们的使用如何影响网页样式和功能,并为

HTML中的'类”属性是什么?HTML中的'类”属性是什么?Apr 28, 2025 pm 05:37 PM

本文解释了HTML“类”属性在分组样式和JavaScript操纵元素中的作用,将其与唯一的“ ID”属性进行对比。

HTML中有哪些不同类型的列表?HTML中有哪些不同类型的列表?Apr 28, 2025 pm 05:36 PM

文章讨论了html列表类型:订购(< ol>),无序(< ul>)和描述(< dl>)。专注于创建和样式列表以增强网站设计。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

螳螂BT

螳螂BT

Mantis是一个易于部署的基于Web的缺陷跟踪工具,用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。

EditPlus 中文破解版

EditPlus 中文破解版

体积小,语法高亮,不支持代码提示功能

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

功能强大的PHP集成开发环境

SecLists

SecLists

SecLists是最终安全测试人员的伙伴。它是一个包含各种类型列表的集合,这些列表在安全评估过程中经常使用,都在一个地方。SecLists通过方便地提供安全测试人员可能需要的所有列表,帮助提高安全测试的效率和生产力。列表类型包括用户名、密码、URL、模糊测试有效载荷、敏感数据模式、Web shell等等。测试人员只需将此存储库拉到新的测试机上,他就可以访问到所需的每种类型的列表。