0
点赞
收藏
分享

微信扫一扫

HTML-head-00

云卷云舒xj 2022-02-04 阅读 75

3、头标签 head

html5 的比较完整的骨架:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	  <meta name="Author" content="">
    <meta name="Keywords" content="" />
    <meta name="Description" content="" />
    <title>Document</title>
</head>
<body>

</body>
</html>

head标签里的页面的配置

头标签内部的常见标签如下:

  • <title>:指定整个网页的标题,在浏览器最上方显示。
  • <base>:为页面上的所有链接规定默认地址或默认目标。
  • <meta>:提供有关页面的基本信息
  • <body>:用于定义HTML文档所要显示的内容,也称为主体标签。我们所写的代码必须放在此标签內。
  • <link>:定义文档与外部资源的关系。

meta 标签

meta表示“元”。“元”配置,就是表示基本的配置项目。

常见的几种 meta 标签如下:

(1)字符集 charset:

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

字符集用meta标签中的charset定义,charset就是character set(即“字符集”),即网页的编码方式

字符集(Character set)是多个字符的集合。计算机要准确的处理各种字符集文字,需要进行字符编码,以便计算机能够识别和存储各种文字。

上面这行代码非常关键, 是必须要写的代码,否则可能导致乱码。比如你保存的时候,meta写的和声明的不匹配,那么浏览器就是乱码。

utf-8是目前最常用的字符集编码方式,常用的字符集编码方式还有gbk和gb2312等。关于“编码方式”,我们在下一段会详细介绍。

(2)视口 viewport:

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

width=device-width :表示视口宽度等于屏幕宽度。

(3)定义“关键词”:

举例如下:

<meta name="Keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信" />

这些关键词,就是告诉搜索引擎,这个网页是干嘛的,能够提高搜索命中率。让别人能够找到你,搜索到你。

(4)定义“页面描述”:

meta除了可以设置字符集,还可以设置关键字和页面描述。

只要设置Description页面描述,那么百度搜索结果,就能够显示这些语句,这个技术叫做SEO(search engine optimization,搜索引擎优化)。

设置页面描述的举例:

<meta name="Description" content="网易是中国领先的互联网技术公司,为用户提供免费邮箱、游戏、搜索引擎服务,开设新闻、娱乐、体育等30多个内容频道,及博客、视频、论坛等互动交流,网聚人的力量。" />

还有一个<meta>标签是需要记住的:

<meta http-equiv="refresh" content="3;http://www.ximingx.com">

上面这个标签的意思是说,3秒之后,自动跳转。

title 标签:

用于设置网页标题:

	<title>网页的标题</title>

title标签也是有助于SEO搜索引擎优化的。

base标签

<base href="/">

base 标签用于指定基础的路径。指定之后,所有的 a 链接都是以这个路径为基准。

举报

相关推荐

0 条评论