上一篇实现了一个简单的网页，是不是觉得网页制作也就那么回事呢，接下来解释一下下面标签的含义以及他们的作用。
<!DOCTYPE html>
<html lang="en">
<head>
<title>我的第一张网页</title>
</head>
<body>
我在这儿！！！！！！
</body>
</html>
<!DOCTYPE html>,它是html5标准网页声明,全称为Document Type HyperText Mark-up Language，意思为文档种类为超文本标记性语言或超文本链接标示语言，它位于文档中的最前面的位置，可告知浏览器文档使用哪种 HTML 或 XHTML 规范。
<html lang="en"></html>，这个标签他是一个网页的最外层标签，它仅次于<!DOCTYPE html>下面，而且是以<html>开始，以</html>结束的双标签，如果把一个项目看做是人的就话，<html lang="en"></html>就是一个完整的人，再看它的里面有lang="en"属性，它的是用来规定元素内容的语言。en：English。zh：Chinese。lang的属性值有很多，关于<html></html>的属性及属性值可以参考https://www.runoob.com/tags/html-language-codes.html
<head></head>它是人体的头部，看到这个双标签的单词有没有发现标签很语义化，从上面的头部标签可以看到它里面还有一个 <title></title>标签，头部标签里面还可以放<base>,<link>,<meta>,<script>,<style>,<title>。
<head>里可放的标签
<title> 标签定义文档的标题，在所有 HTML 文档中是必需的。
<title>元素：
- 定义浏览器工具栏中的标题
- 提供页面被添加到收藏夹时的标题
- 显示在搜索引擎结果中的页面标题
注释：一个 HTML 文档中不能有一个以上的 <title> 元素。
提示：如果您遗漏了 <title> 标签，文档作为 HTML 是无效的。
全局属性
<title> 标签支持 HTML 的全局属性。
<base>标签为页面上的所有链接规定默认地址或默认目标。https://www.runoob.com/tags/tag-base.html
<!DOCTYPE html>
<html lang="en">
<head>
<!-- <base target="_blank"> 只用一个target可以为所有链接规定打开方式-->
<!--target属性的值：
_blank：在新窗口打开链接
_self:在当前窗口打开链接
_parent:在父框架集中打开链接
_top:在整个窗口中打开链接
-->
<base href="https://www.baidu.com/?tn=78000241_25_hao_pg" target="_top">
<title>我的第一张网页</title>
</head>
<body>
我在这儿！！！！！！
<a href="">我用base标签里的href地址</a>当href为空的时候，点击a标签可以使用base的href地址
<a href="http://www.runoob.com/images/">我用自身a标签里的href地址</a>
</body>
</html>
提示：在一个文档中，最多能使用一个 <base> 元素。
如果使用了 <base> 标签，则必须具备 href 属性或者 target 属性或者两个属性都具备。
<link>定义了一个文档和外部资源之间的关系，最常见的用途是链接样式表。
<head>
<link rel="stylesheet" type="text/css" href="theme.css" hreflang="en" media="print">
</head>
属性
New：HTML5 新属性。
| 属性 | 值 | 描述 |
|---|---|---|
| charset | char_encoding | HTML5 不支持该属性。 定义被链接文档的字符编码方式。 |
| href | URL | 定义被链接文档的位置。 |
| hreflang | language_code | 定义被链接文档中文本的语言。 |
| media | media_query | 规定被链接文档将显示在什么设备上。 |
| rel | alternate,archives,author,book-mark,external,first,help,icon,last,license,next,nofollow,noref-errer,pingback,prefetch,prev,search,sidebar,stylesheet,tag,up | 必需。定义当前文档与被链接文档之间的关系。 |
| rev | reversed relationship | HTML5 不支持该属性。 定义被链接文档与当前文档之间的关系。 |
| sizes(New) | HeightxWidth any | 定义了链接属性大小，只对属性 rel="icon" 起作用。 |
| target | _blank,_self,_top,_parent,frame_name | HTML5 不支持该属性。 定义在何处加载被链接文档。 |
| type | MIME_type* | 规定被链接文档的 MIME 类型。 |
<meta>提供了 HTML 文档的元数据。元数据不会显示在客户端，但是会被浏览器解析。通常用于指定网页的描述，关键词，文件的最后修改时间，作者及其他元数据。元数据可以被使用浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 Web 服务调用。
注意：<meta> 标签通常位于 <head> 区域内。元数据通常以 名称/值 对出现。如果没有提供 name 属性，那么名称/值对中的名称会采用 http-equiv 属性的值。
HTML 4.01 与 HTML5之间的差异
HTML5 不支持 scheme 属性。
在 HTML5 中，有一个新的 charset 属性，它使字符集的定义更加容易：
HTML 4.01： <meta http-equiv="content-type" content="text/html; charset=UTF-8">
HTML5： <meta charset="UTF-8">
<!--实例 1 - 定义文档关键词，用于搜索引擎：-->
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
<!--实例 2 - 定义web页面描述：-->
<meta name="description" content="Free Web tutorials on HTML and CSS">
<!--实例 3 - 定义页面作者：-->
<meta name="author" content="Hege Refsnes">
<!--实例 4 - 每30秒刷新页面：-->
<meta http-equiv="refresh" content="30">
<meta name="author" http-equiv="refresh" content="30" charset="UTF-8">
属性
New ：HTML5 新属性。
| 属性 | 值 | 描述 |
|---|---|---|
| charset(New) | character_set | 定义文档的字符编码。 |
| content | text | 定义与 http-equiv 或 name 属性相关的元信息。 |
| http-equiv | content-type,default-style,refresh | 把 content 属性关联到 HTTP 头部。 |
| name | application-name,author,description,generator,keywords | 把 content 属性关联到一个名称。 |
| scheme | format/URI | HTML5不支持。 定义用于翻译 content 属性值的格式。 |
<script>用于定义客户端脚本，比如 JavaScript。<script> 元素既可包含脚本语句，也可以通过 "src" 属性指向外部脚本文件。JavaScript 通常用于图像操作、表单验证以及动态内容更改。
注释：如果使用 "src" 属性，则 <script> 元素必须是空的。
提示：请参阅 <noscript> 元素，对于那些在浏览器中禁用脚本或者其浏览器不支持客户端脚本的用户来说，该元素非常有用。
注释： 有多种执行外部脚本的方法：
- 如果 async="async"：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）
- 如果不使用 async 且 defer="defer"：脚本将在页面完成解析时执行
- 如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本
HTML 4.01 与 HTML5之间的差异
在 HTML 4 中，"type" 属性是必需的，但在 HTML5 中是可选的。
"async" 属性是 HTML5 中的新属性。
HTML5 中不再支持 HTML 4.01 中的某些属性："xml:space"。
属性
| 属性 | 值 | 描述 |
|---|---|---|
| async (New) | async | 规定异步执行脚本（仅适用于外部脚本）。 |
| charset | charset | 规定在脚本中使用的字符编码（仅适用于外部脚本）。 |
| defer | defer | 规定当页面已完成解析后，执行脚本（仅适用于外部脚本）。 |
| src | URL | 规定外部脚本的 URL。 |
| type | MIME-type | 规定脚本的 MIME 类型。 |
| xml:space | preserve | HTML5 不支持。规定是否保留代码中的空白。 |
<style> 标签定义 HTML 文档的样式信息。在 <style> 元素中，您可以规定在浏览器中如何呈现 HTML 文档。每个 HTML 文档能包含多个<style> 标签。
提示：如需链接外部样式表，请使用 <link>标签。
注释：如果没有使用 "scoped" 属性，则每一个 <style> 标签必须位于 head 头部区域。
HTML 4.01 与 HTML5之间的差异
"scoped" 属性是 HTML 5 中的新属性，它允许我们为文档的指定部分定义样式，而不是整个文档。
如果使用 "scoped" 属性，那么所规定的样式只能应用到 style 元素的父元素及其子元素。
属性
New：HTML5 中的新属性。
| 属性 | 值 | 描述 |
|---|---|---|
| media | media_query | 为样式表规定不同的媒体类型。 |
| scoped(New) | scoped | 如果使用该属性，则样式仅仅应用到 style 元素的父元素及其子元素。 |
| type | text/css | 规定样式表的 MIME 类型。 |
全局属性
<style> 标签支持 HTML 的全局属性。
事件属性
<style> 标签支持 HTML 的事件属性。
<body>
<body>标签定义文档的主体(相当于人的身体)。<body> 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等）。
HTML 4.01 与 HTML5之间的差异
在 HTML 5 中，删除了所有 body 元素的"呈现属性"。
在 HTML 4.01 中，所有 body 元素的"呈现属性" 已废弃。
<body>里面可以放许多标签，例如：
块级标签：<div></div>,<p></p>,<h1></h1>...<h6></h6>等等。
行级标签：<a></a>,<b></b>,<span></span>,<em></em>,<i></i>等等。
块级元素
1.总是从新的一行开始
2.高度、宽度都是可控的
3.宽度没有设置时，默认为100%
4.块级元素中可以包含块级元素和行内元素
提示：块级的<p></p>是不可以包裹<div></div>的
行内元素
1.和其他元素都在一行
2.高度、宽度以及内边距都是不可控的
3.宽高就是内容的高度，不可以改变
4.行内元素只能行内元素，不能包含块级元素
注：文章是参照https://www.runoob.com来学习并解释，想了解更详细的情况可以去细品。
网友评论