什么是网站？
网站是指在因特网上根据一定的规则，使用HTML等制作的用于展示特定内容相关的网页集合。
什么是网页？
网页是网站中的一“页”，通常是HTML格式的文件，他要通过浏览器来阅读。网页是构成网站的基本元素，通常由图片，链接，文字等元素组成。
什么是HTML？
HTML指的是超文本标记语言（Hyper Text Markup Language），它是一种描述网页的语言。HTML不是一种编程语言，而是一种标记语言。标记语言就是一套标记标签。所谓的超文本，有两层含义：1.它可以加入图片，声音，动画，多媒体等内容（超越了文本的限制）2.它还可以从一个文件跳转到另一个文件，与世界各地主机的文件链接（超级链接文本）。
什么是浏览器？
浏览器是网页显示，运行的平台。
浏览器内核（渲染引擎）：负责读取网页内容，整理讯息，计算网页的显示方式并显示页面。
为什么需要Web标准
Web标准是由W3C组织和其他标准化组织定制的一系列标准的集合。因为浏览器的不同，它们显示页面或者排版就有些许差异，所以需要Web标准。Web标准主要由三个方面构成：1.结构 2.表现 3.行为。
VS Code插件
1.Chinese 2.Auto Rename Tag 3.open in browser 4.Live Server 5.vscode-icons
快捷键
shift+alt+↓ 下箭头 ctrl+d 多个选中 ctrl+h 全局替换某个单词 ctrl+g 快速到某一行
文档类型标签声明
<!DOCTYPE>文档类型声明，作用是告诉浏览器使用哪种HTML版本来显示页面（不是HTML标签，是文档类型声明标签）
<!DOCTYPE html>的意思是：当时页面采取的是HTML5版本来显示页面
<html lang="en">：用来定义当前文档显示的语言
en定义为英语 zh-CN定义为中文
简单的来说，定义为en就是英文网页，定义为zh-CN就是中文页面。
<meta charset="UTF-8">
这是字符集标签，防止乱码，UTF-8被称为万国码，基本包含了全世界所有国家需要用到的字符HTML常用标签
标题标签
//标题标签
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>特点：1.加了标题标签的文字会变大变粗，字号也依次变大 2.一个标题独占一行
段落标签和换行标签，分割线
//段落标签
<p>我是一个段落标签</p>
//换行标签，是一个单标签
<br/>
用来强制换行
//分割线
<hr>文本格式化标签
在网页中，有时需要为文字设置粗体，斜体或下划线等效果，这是就需要用到HTML中的文本格式化标签，使文字以特殊的方式显示。
//加粗
<strong></strong>
<b></b>
//倾斜
<em></em>
<i></i>
//删除线
<del></del>
<s></s>
//下划线
<ins></ins>
<u></u>
<div>和<span>标签
<div>和<span>是没有语义的，他们就是一个盒子，用来装内容的，我们可以把图片和文字等
放到盒子里
特点：1.<div>标签用来布局，但是现在一行只能放一个<div>，大盒子，单独占一行
2.<span>标签用来布局，一行可以放多个<span>，小盒子
<div>我是一个div标签，我一个人独占一行</div>
<span>我是一个span标签，我一行可以有多个</span>图像标签
<img>是一种单标签，src是<img>的必须属性，它用来指定图像文件的路径和文件名
| 属性 | 属性值 | 说明 |
| src | 图片路径 | 必须属性 |
| alt | 文本 | 替换文本。图片不能显示时的文字 |
| title | 文本 | 提示文本。鼠标放在图像上显示的文本 |
| width | 像素 | 设置图像的宽度 |
| height | 像素 | 设置图像的高度 |
| border | 像素 | 设置图像的边框粗细 |
<img src="img.jpg" />超链接标签
| 属性 | 作用 |
| href | 用于指定链接目标的url地址（必须熟悉）。 |
| target | 用于指定链接页面的打开方式，其中_self为默认值，为当前窗口打开，_blank为在新窗口中打开方式。 |
<a href="http:qq.com" target="_blank">链接名称</a>链接分为外部链接和内部链接，外部链接的值为网址，内部链接的值为内部页面的名称。
如果href里面地址是一个文件或者压缩包，会下载这个文件。
在网页中的各种网络元素，如文本，图像，视频等都可以添加超链接。
锚点链接：当前页面快速跳转到某个地方
<a href="#live">个人生活</a>
<h3 id="live">个人生活</h3>引用其他标签的id时，前面需要加一个#，格式为#id
注释和特殊字符
注释：快捷键 ctrl+/
<!-- 注释语句 -->特殊字符
| 特殊字符 | 字符的代码 |
| 空格符 |  ； |
| < | <； |
| > | >； |
| & | &； |
| 人名币符号 | ¥； |
| 平方2 | ² |
| 平方3 | ³ |
| 正负号 | ±； |
| 摄氏度 | °； |
| 版权 | © |
表格标签
表格的作用：用来显示和展示数据，因为它可以让数据显示的非常的规整，可读性非常好。
表格不是用来布局页面的，而是用来展示数据的。
<table></table>是用来定义表格的标签
<tr></tr>是用来定义表格中的行，必须嵌套在<table></table>中
<th></th>是用来定义表格中的表头单元格，表头单元格里面的文本内容加粗居中显示（可以不用<th></th>标签）
<td></td>是用来定义表格中的单元格，必须嵌套在<tr></tr>中表格标签中的这部分属性我们在实际开发中并不常用，主要后面通过CSS来设置
| 属性名 | 属性值 | 描述 |
| align | left，center，right | 规定表格相对于页面水平的对其方式 |
| border | 1或"" | 规定表格单元格是否拥有边框 默认为"",表示没有边框 |
| cellpadding | 像素值 | 规定单元格四周边沿与其内容之间的空白，默认1像素（主要以单元格左边沿为准） |
| cellspacing | 像素值 | 规定单元格之间的空白，默认2像素 |
| width | 像素值或百分比 | 规定表格的宽度 |
表格结构标签
使用场景：可能表格很长，为了更好的表示表格的语义，可以将表格分割成 表格头部和表格主体两个部分。
<thead></thead>表示表格的头部区域
<tbody>/<tbody>表示表格的主体区域
这两个标签都是放在<table></table>标签中合并单元格
跨行合并：最上侧单元格为目标单元格，写合并代码
跨列合并：最左侧单元格为目标单元格，写合并代码
找到目标单元格，写上合并方式=合并的单元格数量。比如：<td colspan="2"></td>
//跨行合并
<td colspan=""></td>
//跨列合并
<td rowspan=""></td>列表标签
表格是用来显示数据的，那么列表就是拿来布局的。
列表最大的特点就是整齐，整洁，有序，它作为布局会更加自由和方便。
列表分为三大类：有序列表，无序列表和自定义列表
<ul></ul>表示无序列表
<li></li>表示列表项
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>无序列表的各个列表项之间没有顺序级别之分，是并列的。
<ul></ul>中只能嵌套<li></li>，不能在<ul></ul>中使用其他标签，这是一种规范。
<ol></ol>表示有序列表
<li></li>表示列表项
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ol><ol></ol>中只能嵌套<li></li>，不能在<ol></ol>中使用其他标签，这是一种规范。
自定义列表常用于对术语或者名词进行解释和描述，定义列表的列表项前没有任何符号
<dl></dl>用来定义自定义列表
<dt></dt>定义项目名称
<dd></dd>解释项目名称
<dl>
<dt>名词1</dt>
<dd>名词1解释</dd>
<dd>名词1解释</dd>
<dt>名词2</dt>
<dd>名词2解释</dd>
<dd>名词2解释</dd>
</dl><dl></dl>中只能包含<dt></dt>和<dd></dd>标签，<dt></dt>和<dd></dd>个数没有限制。
表单标签
使用表单的目的是为了收集用户信息。在我们网页中，我们也需要跟用户进行交互，收集用户资料，此时就需要表单。
在HTML中，一个完整的表单通常是由表单域（包含表单元素的区域），表单控件（也称为表单元素）和提示信息三个部分构成。
form标签属性（表单域）
| 属性 | 属性值 | 作用 |
| action | url地址 | 用于指定接收并处理表单数据的服务器程序的url地址 |
| method | get/post | 用于设置表单数据的提交方式，其取值为get或post |
| name | 名称 | 用于指定表单的名称，以区别同一个页面中的多个表单域 |
<form></form>标签用于定义表单域，以实现用户信息的收集和传递。
<form>会把它范围内的表单元素信息提交给服务器。表单控件（表单元素）
在表单域中可以定义各个表单元素，这些表单元素就是允许用户在表单中输入或者选择的内容控件。
<input>表单元素
<input>标签用于收集用户信息，是单标签
| type属性值 | 描述 |
| button | 定义可点击按钮（多数情况下，用于通过Javascript启动脚本，结合Javascript搭配使用）。 |
| checkbox | 定义复选框。 |
| file | 定义输入字段和“浏览”按钮，供文件上传。 |
| hidden | 定义隐藏的输入字段。 |
| image | 定义图像形式的提交按钮。 |
| password | 定义密码字段。该字段中的字符被掩码。 |
| radio | 定义单选按钮。 |
| reset | 定义重置按钮。重置按钮会清除表单中的所有数据。 |
| submit | 定义提交按钮。提交按钮会把表单数据会发送到服务器。 |
| text | 定义单行的输入字段，用户可在其中输入文本。默认宽度为20个字符 |
除type属性外，<input>标签还有很多其他属性，其常用属性如下：
| 属性 | 属性值 | 描述 |
| name | 由用户自定义 | 定义input元素的名称 |
| value | 由用户自定义 | 规定input元素的值 |
| checked | checked | 规定此input元素首次加载时应当被选择 |
| maxlength | 正整数 | 规定输入字段中的字符的最大长度 |
<input type="">radio单选按钮必须拥有相同的名字name，才可以实现多选一（checkbox标签也可以name相同）
<input type="radio" name="sex">男 <input type="radio" name="sex"> 女value值在文本框看到效果，也可以在submit按钮中看到效果
用户名:<input type="text" value="请输入用户名">1.name和value是每个表单元素都有的属性值，主要是给后台人员使用的。
2.name表单元素的名称，要求单选按钮和复选框都要有相同的name值。
3.单选框和复选框可以设置checked属性
get提交
post提交
label标签
<label>标签为input元素定义标注（标签），用于绑定一个表单元素，当点击<label>标签内的文本时，浏览器就会自动将焦点（光标）转到或者选择对应的表单元素上，用来增加用户体验。
<input type="radio" name="sex" id="man"><label for="man">男区别锚点链接的#id
<select>表单元素
<select name="1" id="1">
<option value="">选项1</option>
<option value="" selected="selected">选项2</option>
<option value="">选项3</option>
<option value="">选项4</option>
</select>1.<select>里至少包含一对<option>
2.在<option>中定义selected=“selected”时，当前项为默认选中项。
textarea文本域元素
当用户输入内容较多的情况下，我们就不能使用文本框表单，此时我们可以使用<textarea>标签
<textarea name="" id="" cols="30" rows="10"></textarea>路径
目录文件：就是普通文件夹，只不过里面存放了我们做页面所需要的相关素材，比如html文件，图片等。
根目录：打开目录文件后的第一层就是根目录。
相对路径：以引用文件所在的位置为参考基础，而建立出的目录路径。上一级路径为：../
绝对路径：是指目录下的绝对位置，直接到达目标的位置，通常是从盘符开始的路径
117
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
