教育行业A股IPO第一股（股票代码 003032）

全国咨询/投诉热线：400-618-4000

天富娱乐登录彩票 怎样使用H5头部标签？具体代码演示

更新时间:2020年12月22日17时36分 来源:传智教育 浏览次数:

好口碑IT培训

制作网页时，经常需要设置页面的基本信息，如页面的标题、作者、和其他文档的关系等。为此HTML提供了一系列的标签，这些标签通常都写在head标签内，因此被称为头部相关标签。本节将具体介绍常用的头部标签。

      1.设置页面标题标签标签，之间的内容将显示在浏览器窗口的标题栏中。例如将页面标题设置为“轻松学习天庭娱乐官网app下载贴吧”，具体代码如下：

 <title>轻松学习天庭娱乐官网app下载贴吧</title>

上述代码对应的页面标题效果如图1所示。

图 1设置页面标题标签<title>

2.定义页面元信息标签<meta/>
      <meta />标签用于定义页面的元信息（元信息不会显示在页面中），可重复出现在<head>头部标签中。在HTML中，<meta />标签是一个单标签，本身不包含任何内容，仅仅表示网页的相关信息。通过<meta />标签的两组属性，可以定义页面的相关参数。例如为搜索引擎提供网页的关键字、作者姓名、内容描述，以及定义网页的刷新时间等。下面介绍<meta />标签常用的几组设置，具体如下。

1)<mate name="名称" content=“值”/>

在<meta/> 标签中使用name和content属性可以为搜索引擎提供信息，其中name属性用于提供搜索内容的名称，content属性提供对应的搜索内容值，具体应用如下。

●设置网页关键字，例如某图片网站的关键字设置：

 <meta name="keywords" content="千图网,免费素材下载,千图网免费素材图库,矢量图,矢量图库,图片素材,网页素材,免费素材,PS素材,网站素材,设计模板,设计素材， 网页模板免费下载,千图,素材中国,素材,免费设计,图片" />

其中name属性的值为keywords，用于定义搜索内容名称为网页关键字，content属性的值用于定义关键字的具体内容，多个关键字内容之间可以用“,”分隔。

●设置网页描述，例如某图片网站的描述信息设置：

 <meta name="description" content="专注免费设计素材下载的网站！提供矢量图素材,矢量背景图片,矢量图库,还有psd素材,PS素材,设计模板,设计素材,PPT素材,以及网页素材,网站素材,网页图标免费下载" />

其中name属性的值为description，用于定义搜索内容名称为网页描述，content属性的值用于定义描述的具体内容。需要注意的是网页描述的文字不必过多，能够描述清晰即可。

●设置网页作者，例如可以为网站增加作者信息：

 <meta name="author" content="网络部" />

其中name属性的值为author，用于定义搜索内容名称为网页作者，content属性的值用于定义具体的作者信息。

2)<mate name="名称" content=“值”/>

在 标签中使用http-equiv和content属性可以设置服务器发送给浏览器的HTTP头部信息，为浏览器显示该页面提供相关的参数标准。其中，http-equiv属性提供参数类型，content属性提供对应的参数值。默认会发送，通知浏览器发送的文件类型是HTML。具体应用如下：

●设置字符集，例如某图片官网字符集的设置：

 <meta http-equiv="Content-Type" content="text/html; charset=gbk" />

其中http-equiv属性的值为Content-Type，content属性的值为text/html和charset=gbk，两个属性值中间用“;”隔开。这段代码用于说明当前文档类型为HTML，字符集为gbk(中文编码)。目前最常用的国际化字符集编码格式是utf-8，常用的国内中文字符集编码格式主要是gbk和utf-8。当用户使用的字符集编码不匹配当前浏览器时，网页内容就会出现乱码。

值得一提的是，在天庭娱乐官网app下载贴吧中，简化了字符集的写法，变为如下所示代码。

 <meta charset="utf-8">

●设置页面自动刷新与跳转，例如定义某个页面10秒后跳转至百度：

 <meta http-equiv="refresh" content="10; url= https://www.baidu.com/" />

其中http-equiv属性的值为refresh，content属性的值为数值和url地址，中间用“;”隔开，用于指定在特定的时间后跳转至目标页面，该时间默认以秒为单位。

猜你喜欢：

JavaScript如何引入脚本文件？

【前端】盒子模型不同边框样式属性和应用技巧讲解

html中figcaption标签的作用

传智web前端培训课程

0 分享到：
和我们在线交谈！