html5中的meta标签的三要素是什么?meta标签的使用总结

本篇文章主要的为大家讲述的是关于html meta标签的三要素,就是三属性的组成和使用的介绍,里面有很多比较重要的属性值,在网页中都是很有用的,现在让我们一起来看这篇文章吧

首先我们要知道meta标签的三要素是什么?

1.必选属性:content属性。该属性是为了定义与http-equiv或者name属性相关的元信息,其中的内容是为了便于搜索机器人查找信息和分类使用的。

2. 可选属性: name属性该属性主要用于描述网页。Name属性的值可以有:author、description、keyword、generator等等

3.可选属性:http-equiv属性。该属性相当与http的头文件作用,可以向浏览器返回一些有用的信息,以帮助正确和精确显示内容。http-equiv属性的值可以有content-type、expires、refresh等等;

这是这三个属性组成了html5 meta标签的三要素。

现在来看看这些属性具体的使用介绍:

但是打开任意的网站,其head标签内都有一列的meta标签。

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

meta标签共有两个属性,分别是http-equiv属性和name属性

HTML5 meta标签的name属性:

name属性主要用于描述网页,比如网页的关键词,叙述等。与之对应的属性值为content,content中的内容是对name填入类型的具体描述,便于搜索引擎抓取。meta标签中name属性语法格式是:

<meta name="参数"content="具体的描述">。

其中name属性最重要的一个参数。

HTML5 meta标签的name属性的值keywords(关键字):

说明:用于告诉搜索引擎,你网页的关键字。举例:

<meta name="keywords"content="Lxxyx,博客,文科生,前端">

HTML5 meta标签的name属性的值description(网站内容的描述):

说明:用于告诉搜索引擎,你网站的主要内容。举例:

<meta name="description"content="编程之家,编程学习的网站,在线视频教程">

HTML5 meta标签的name属性的值author(作者):

用于标注网页作者举例:

<meta name="author"content="编程之家">

HTML5 meta标签的http-equiv属性:

http-equiv顾名思义,相当于http的文件头作用。

相当于HTTP的作用,比如说定义些HTTP参数啥的。

meta标签中http-equiv属性语法格式是:

<meta http-equiv="参数" content="具体的描述">

其中http-equiv属性说说其中一个参数:

content-Type(设定网页字符集)(推荐使用HTML5的方式)

说明:用于设定网页字符集,便于浏览器解析与渲染页面举例:

<meta http-equiv="content-Type" content="text/html;charset=utf-8"> //旧的HTML,不推荐

<meta charset="utf-8"> //HTML5设定网页字符集的方式,推荐使用UTF-8

总结的就这么多了,meta标签的自定义属性实在太多了。所以只去找了常用的一些,还有像 Window-target 这样已经基本被废弃的属性,我也没有添加。

HTML5 meta标签的作用:

META标签是HTML标记HEAD区的一个关键标签,提供文档字符集、使用语言、作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO)。

【小编推荐】

html p标签是单标签吗?html p标签的使用方法介绍(内附实例)

input表单如何制作多行文本输入框?一篇文章教你学会使用input标签

以上就是html5中的meta标签的三要素是什么?meta标签的使用总结的详细内容,更多请关注编程之家其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码
HTML5使用DOM进行自定义控制
使用HTML5 Canvas绘制阴影效果的方法
使用PHP和HTML5 FormData实现无刷新文件上传
如何解决HTML5 虚拟键盘出现挡住输入框的问题
HTML5中div和section以及article的区别分析
html5和CSS 实现禁止IOS长按复制粘贴功能
html5 touch事件实现触屏页面上下滑动
canvas 模拟实现电子彩票刮刮乐的代码
HTML5 Plus 实现手机APP拍照或相册选择图片上传的功能
Android自定义环形LoadingView效果
HTML5 canvas绘制五角星的方法
html5使用html2canvas实现浏览器截图
使用Canvas处理图片的方法介绍
利用Canvas模仿百度贴吧客户端loading小球的方法