目录
1.1HTML 由一个个元素组成（可以嵌套），而元素则一般由一对标签构成。
4.1超级链接在本质上属于一个网页的一部分，它是一种允许我们同其他网页或站点之间进行连接的元素。各个网页链接在一起后，才能真正构成一个网站。
一.HTML简述
HTML的全称为超文本标记语言，是一种标记语言。HTML命令可以说明文字，图形、动画、声音、表格、链接等，可用 HTML来构建Web页面即所谓的网页。
HTML不是一门编程语言，而是一种用于定义内容结构的标记语言，它定义了网页内容的含义和结构。
在浏览器中看到的任何网页背后都是一个HTML文档，在网页中按F12就可以看到：
二.HTML文档
1.HTML元素
1.1HTML 由一个个元素组成（可以嵌套），而元素则一般由一对标签构成。
①开始标签：包含元素的名称，被左、右角括号所包围。表示元素从这里开始或者开始起作用 。
②结束标签：在开始标签的元素名之前加了一个斜杠。这表示着元素的结尾。
③内容：元素的内容。
④元素：开始标签、结束标签与内容相结合，便是一个完整的元素。
1.2空元素
有一些元素只有一个开始标签，通常用来在此元素所在位置插入/嵌入一些东西，如<br>, <hr>, <input>, <img>, <a>等等。这样的元素称其为空元素。
运行效果图：
1.3元素的属性
一个属性必须包含如下内容：
①一个空格，在属性和元素名称之间。如果已经有一个或多个属性，就与前一个属性之间有一个空格。
②属性名称="属性值"，属性值由一对引号 "" 包起来。
运行效果图：
2.HTML文档基本操作
2.1注释
将需要注释的内容写在<!--和-->之中即可注释，也可输入Ctrl + /快捷的进行注释。
运行效果图：
2.2补全基本标签
按“!”+“Tab键会自动补全基本标签：
其中重要的是：
<head> </head>: <head>元素。 这个元素是一个容器，它包含了所有你想包含在HTML页面中但不想在HTML页面中显示的内容。<br>
<title> </title>: 设置页面标题，出现在浏览器标签上，当你标记/收藏页面时它可用来描述页面。<br>
<body> </body>: <body>元素。 包含你能在页面看到的所有内容，包括文本，图片，音频，游戏等等。
运行效果图：
3.标题
HTML 提供了从大到小6级标题，分别是：<h1> ~ <h6>，如下所示：
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
运行效果图：
4.超链接
4.1超级链接在本质上属于一个网页的一部分，它是一种允许我们同其他网页或站点之间进行连接的元素。各个网页链接在一起后，才能真正构成一个网站。
超链接语法：
<a href="https://www.baidu.com/" target="_blank">百度一下</a>
href即为要跳转去的地址URL；
target属性为_blank表示在新的页面打开超链接（默认是在当前页面打开即_self）；
超链接标签包含的内容（当前为文字"百度一下"）即为显示在页面上供用户点击的。
4.2锚点
用于标记页面的某个元素或位置。通过锚点，我们可以轻易的在长页面内实现跳转。先使用id属性生成某元素的锚点，元素的id值必须是唯一的，也即页面不能再有其它元素的id值为C4，超链接中的地址需要有“#”符号，然后再使用超链接指向该锚点即可。
5.图片及文件路径 img
在页面插入一张图片如下：
src属性为要显示图片文件的位置 URL，即图片文件的路径
alt属性当获取图片出现问题时显示的文字（占位符）
可为图片指定高宽度，但不建议（可能导致图片变形）
<img src="https://mdbootstrap.com/img/logo/mdb192x192.jpg" alt="MDB Logo" width="200" height="200">
6.表格 Table
有时，页面的内容需要用表格来进行呈现。我们使用<table>等标签即可，<tr>表示行, <td>表示行中的单元, <th>是表头的单元
运行效果图：
7.列表 List
<ul>
<li>夜曲</li>
<li>夜的第七章</li>
<li>以父之名</li>
</ul>无序列表使用<ul>标签，默认使用实心圆点作为每项的标志
<ol>
<li>夜曲</li>
<li>夜的第七章</li>
<li>以父之名</li>
</ol>有序列表使用<ol>标签，默认使用数字作为每项的标志。
运行效果图：
8.HTML 的元素可以以称为区块或内联的方式进行显示
8.1区块元素
区块元素在浏览器显示时，通常会以新行来开始（和结束）。如：<h1>, <pre>, <ul>, <table>，<div> 等。
运行效果图：
8.2 内联元素
内联元素是一个接一个进行显示，不会新起一行。如： <span>, <input>, <td>, <a>, <img>等。
运行效果图：
9.预设格式
若想在网页中保留vs code格式一样的文字 ，就使用pre标签。
运行效果图：
10.表单Form
当网站需要获取我们的信息时，我们就需要使用表单（form）来让用户填写或选择。
加上Form标签后，网页才会提交我们的信息。 当提交时，表单中没有name属性的元素将不会提交，比如上面工作日期的选择器。有name属性的元素其value的值将提交给服务器。
运行效果图：
三.总结
这是第一次接触HTML，也是第一次知道了如何做网页，看着把语句以网页效果呈现出来还是觉得很新奇。过程中学习了相关的元素，格式和语法，觉得做网页还是很有趣的，接下来可以再多深入学习。
2209
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
