HTML文档头部的title标签和meta有什么作用?

制作网页时,经常需要设置网页的基本信息,如网页的标题、作者等。为此,HTML提供了一系列设置网页信息的标签,这些标签通常都写在

<head>标签内,也被称为HTML.文档头部相关标签。下面将介绍常用的HTML文档头部标签中的<title>和<meta>标签。

(1)<title>标签

<title>标签用于设置HTML页面的标题,也就是为网页取一个名称。在网页结构中,<title>标签必须位于<head>标签内。一个HTML.文档只能含有一个<title>标签,<title></title>标签之间的内容将显示在浏览器窗口的标题栏中。例如,将某个页面标题设置为“轻松学习HTML.5”,示例代码如下:

<title>轻松学习HIML.5</title>

上述代码对应的页面效果如下图:

HTML文档头部的title标签和meta有什么作用?

(2)<meta>标签

<meta>标签用于定义页面的元信息(元信息不会显示在最终的页面效果中),可重复出现在标签中。在HTML中,<meta>标签是一个单标签,本身不包含任何内容,仅表示网页的相关信息。通过标签的属性,可以定义页面的相关参数。

例如,为搜索引擎提供网页的关键字、作者姓名、内容描述,以及定义网页的刷新时间等。下面介绍<meta/>标签常用的几组设置,具体如下。

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

设置网页关键字,如某图像网站的关键字设置,示例代码如下:

    <meta name=“keywoxds”content=“千图网,免费素材下载,千图网免费素材图库,矢量图,矢量图库,图像素材,网页素材,免费素材,PS素材,网站素材,设计模板,设计素材,网页模板免费下载,千图,素材中国,素材,免费设计,图像”/>

在上述示例代码中,nare属性的属性值为"keywonds”,该属性值用于定义搜索内容名称为网页关键字;content 属性的属性值用于定义关键字的具体内容,多个关键字内容之间可以用“,”分隔。

设置网页描述,如某图像网站的描述信息设置,示例代码如下:

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

在上述示例代码中,name属性的属性值为“deseription”,该属性值用于定义搜索内容名称为网页描述;comtent 属性的属性值用于定义描述的具体内容。网页描述的文字不必过多,能够描述清晰即可。

设置网页作者,如可以为网站增加作者信息,示例代码如下:

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

在上述示例代码中,name属性的属性值为”author”,该属性值用于定义搜索内容名称为网页作者;content属性的属性值用于定义具体的作者信息。

<meta http-equiv=”名称”content=”值”>在<meta/>标签中,http-equiv 属性和content 属性可以设置服务器发送给浏览器的HTTP头部信息,为浏览器显示该页面提供相关的参数标准。其中,http-equiv属性提供参数类型,content属性提供对应的参数值,这些属性的具体应用如下。设置字符集,如某图像官网字符集的设置,示例代码如下:

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

在上述示例代码中,hitp-epuiv属性的属性值为“Content-Type”.content属性的属性值为“test/html”和“charset=gbk”,两个属性值之间用“:”隔开。其中,“text/html”用于说明当前文档类型为HIML“charset=gbk”用于说明文档字符集为GBK(中文编码)。

目前最常用的国际化字符集编码格式是UTF-8,常用的中文字符集编码格式主要是GBK和GB2312。当用户使用的字符集编码格式与当前浏览器不匹配时,网页内容就会出现乱码。新版本的HTML.5简化了字符集的写法,示例代码如下:

<meta charset="utf-g">

设置页面自动刷新与跳转,如定义某个页面10秒后跳转至百度首页,示例代码如下:

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

在上述示例代码中,http-equiv属性的属性值为“refresh”,content属性的属性值为数值和URL。两个属性值之间用“:”隔开,分别用于指定跳转时间和目标页面的URL。跳转时间默认以秒为单位。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/276436.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
黑马程序员黑马程序员订阅用户
上一篇 2023年6月15日 07:00
下一篇 2023年6月15日 07:26

相关推荐

  • 分享nofollow标签、h标签、strong标签的作用。

    nofollow标签对于seo的意义重点,其作用是告诉搜索引擎”不要追踪此网页上的链接”或”不要追踪此特定链接,目前各大搜索引擎都支持该标签。对于我们防止权重的分散有重大意义,比如:联系页面、在线咨询等连接都可以…

    2023年6月20日
    01
  • 我来教你普及一些提升SEO优化效果的最强标签。

      对于做网站SEO优化来说,要把关键词写在最强的标签里。我们常用的关键词标签无外乎meta标签和h标签,以及链接、图片和正文文字的一些属性。下面给大家普及一些提升SEO优化效果的最强标签。    首页title,…

    2022年12月4日
    00
  • 小编分享SEO优化工作是一个循环渐进的过程,需要通过实践验证。

    SEO优化工作是一个循环渐进的过程,需要通过实践验证。今天小编就来跟大家说一说HTML标签优化的注意事项,感兴趣的话就一起来了解下吧。标题标签(title)标签标签相当于一个人的名字,一个人的身份证,是网站页面对…

    2023年3月9日
    00
  • 教你alt标签对SEO优化的影响。

    Ait标签的作用想必大家不陌生,它的作用就是用来解释程序无法识别的图片信息,當然随着技术的进步,人脸都可以识别了,图片自然不是问题,尽管如此,识别一张图片的计算量及对资源的使用量等仍旧不可小觑,相比起单…

    2023年6月27日
    00
  • 我来分享怎么做网站优化。

    网站优化简称为SEO,网站优化通称为SEO,网站优化是指的就是说运用百度搜索引擎的排行,把网址的关键字排名靠前。网站优化管不了是公司的网站还是本人的网站必须开展这一流程,愿意给你的网站超过品牌推广、产品品…

    2022年12月2日
    03
  • 小编分享如何在html中加视频。

    在HTML页面中插入视频有多种方法,这里我将详细介绍两种最常见的方法:使用<video>标签和使用<embed>标签,这两种方法都可以让你在网页中嵌入视频,但是它们各有优缺点,你可以根据自己的需求选择适合…

    2024年6月24日
    00
  • 小编分享SEO优化之TDK标签如何设置。

    很多人都在问TDK是什么应该怎么去优化今天小编就知道的一些微末知识和大家分享一下,希望可以帮助大家解答疑惑。 seo优化技术之中有很多代码标签的运用技巧和方法,这些标签如何应用得当,是非常重要的,对网站的帮…

    2023年6月21日
    00
  • 我来教你 淘宝宝贝怎么打标签。

    在淘宝上有很多宝贝是打上了标签的,打了标签的宝贝在推广的时候是占据了很大的优势的,因为系统会根据你的标签进行广告投放,有些新手商家还不知道如何给宝贝打标签,下面说说打标的步骤吧。情况一,对于发布宝贝…

    2023年10月20日
    00

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息