HTML的基本结构

HTML

从现在开始学习html,先来了解一下html大家族当中的一些成员吧。

知识点

  • html标签
  • head标签
  • title标签
  • meta标签
  • body标签

1. 双标签

<标签名>内容</标签名>

双标签是指标签是成对出现的,也就是有一个开始标签和一个结束标签,开始标签用 <标签名> 表示,结束标签用 </标签名> 表示,只有一对标签一起使用才能表示一个具体的含义。例如 <html></html>

2. 单标签

单标签没有开标签和闭标签之分,它只有一个标签,其写法如下所示:

<标签名>

或者

<标签名/>

在介绍 html 标签之前,我们先说说 <!DOCTYPE html> 的意思,它是文档类型声明标签,用于一个文档类型的声明,DOCTYPE 用来保证文档能够正确被读取,html 声明这是一个 html 文档。

html 标签标识该文档为 HTML 文档。它相当于是一个两层楼的房子框架,第一层是 body 楼,居民住在不同类型的房间中,第二层是 head 楼,里面放着居民的信息文件。

图片描述

房子图片来自于 ICONS8

<html> 标签置于 HTML 文档最前边,用来标识 HTML 文档的开始,而 </html> 标签恰好相反,它放在 HTML 文档最后边,用来标识 HTML 文档的结束。

两个标签必须成对使用,网页中其他的所有标签都应该放在 <html></html> 标签之间。

基本语法:

<html>
  ...
</html>
标签意义
定义网页标题内容
有关于文档本身的元信息,例如:文档的作者,用于查询的关键字,关于文档的描述

3.meat标签

meta 标签的功能是提供关于页面的元信息,能够提供文档作者、关键字、描述等多种信息,在 HTML 的头部可以包括任意数量的 meta 标签。

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

其中,namecontent 被称为属性,viewportwidth=device-width, initial-scale=1.0 被称为属性值。

例如:我们添加一个作者的信息。

<meta name="author" content="zhy,1908721295@qq.com" />

除了上面介绍的属性,这里再给大家介绍一个字符编码的属性,大家知道我们现在常用的是 UTF-8 编码,这种通用的编码使我们的页面内容能够在不同情况下被正确的解析。

meta 标签中,我们使用 charset 属性来规定字符编码,在解析文档时,会告诉浏览器我们使用的编码形式。使用如下:

<meta charset="utf-8" />

这里只是简单介绍了 meta 标签,若想了解更多内容,请阅读文档级元数据

4.title标签

它有以下几个方面的用处:

  1. 可以在浏览者保存该页面时成为默认的保存文件名。
  2. 可以在浏览者将该网址添加进收藏夹时成为收藏夹中该网址的名称。
  3. 方便搜索引擎索引页面。
  4. 搜索引擎显示的页面标题往往就是网页 <title> 标签的内容。

5.body标签

body 标签界定了 HTML 文档的主体。在 <body></body> 之间放的是要显示在页面上的所有内容,如文本、超链接、图像、表格和列表等。

基本语法:

<body>
  ...
</body>
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

随缘而愈

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值