【JavaEE】进入Web开发的世界-HTML
目录
一、HTML
1.1概念篇
1.2工具篇
1.2.1文本类型的标签
1.2.2多媒体标签
1.2.3超链接
1.2.4target
1.2.5表格相关的标签
1.2.6 列表标签
1.2.7表单标签
进入Web开发的世界，了解html、css、JavaScript的使用。
Web开发的核心：准备各式各样的资源以及资源之间的相互关系。
主机 (host) 决定了资源位于网络中的哪台电脑 (主机) 上，通常是 IP 地址 或者是 域名。
端口(port)决定了 资源由主机上的哪个 进程 (process) 提供服务，这个进程就是我们所谓的 Web 服务器。
我们目前使用的是 Tomcat。认准我们平时使用的端口 :8080
资源路径 (path) 决定了请求的是 Web 服务器中的哪个资源。可以分成绝对路径 和 相对路径
我们所谓的 Web 开发，就是准备各种百相配合的 Web 资源的过程
一、HTML
HTML属于前段的知识范畴，主要起到提供页面的结构和基本内容。目前不负责长什么样子。
1.1概念篇
1、超文本
比一般的文本能力跟更强，对于txt文本，可以有超链接。
2、怎么理解标记
HTML中的标签是有规定的，并不是任何标签都可以（最新的标准允许自定义标签）
通常标签是开始标签、内容和闭合标签组成的。有部分标签是单一标签
美好的一天
（前面是开始标签 (open tag)，后面是闭合标签 (close tag））HTML 的结构也有规定，虽然大多数浏览器兼容不符合规定格式，但对于我们来说尽量去符合格式
IDEA 是可以帮我们生成内容的，一般写出来都符合格式。
标签允许有属性 (attributes) 存在，放在 开始标签 里，基本格式是 key=value 的形式，注意，key=value，这个等号两边没有空格，其中，key 不需要引号引起来，value 需要引号引起来，单/双引号均可。
代表 html 的字符集使用 utf-8。
1.2工具篇
大部分浏览器基本都有这套工具，但用法略有区别，所以我使用的是 chrome 浏览器，比较统一，由于版本的原因，也可能有所区别。
介绍一些常见标签https://developer.mozilla.org/zh-CN/ mozilla 组织 (firefox 的开发团队)
1.2.1文本类型的标签
表示标题类型的标签 一级标题、二级标题...、六级标题
....
....
默认的样式(以后是可以通过 css 修改的)...一级标题最大，六级标题最小
html中的换行、空格最终显示的时候都是被视为一个空格。
html中有些标签是自带换行的（一般称为块级标签）还有一类标签是不带换行的一般称为内联标签。
也是块级标签，上述
....也是块级标签。
是单一标签，作用是换行，不用写闭合。
1.2.2多媒体标签
插入一个图片资源（多个资源配合）
是单一标签，关键属性是src = “图片资源的路径”，如果路径不正确，或者不支持访问，网页不会正常显示。
html/css/is 中书写路径的话
资源和当前资源 处于同一个 Web 服务器管理下 或者 没有处于同一个 Web 服务器管理下
1) 全 URL:
协议://主机:端口/资源路径 其中 端口 如果是协议的标准端口可以省略
http://127.0.0.1:8080/2023/01/z.html
http://61.135.81.24/a/b/2023.html 没有端口，同时是 http 协议，说明是 80 端
https://51.10.55.228/hello.html 没有端口，同时是 https 协议，说明是 443 端
jdbc:mysgl://127.0.0.1:3306/ccb 0101，JDBC 连接 MySQL (本机的 MySQL) 的 URL
dbc:mysql://61.185.22.37:3306/ccb 0101，JDBC 连接 非本机的 (处于 61.185.22.37 主机) 上的 MySQL
jdbc:mysql://127.0.0.1/ccb 0101 没有端口，同时 idbc:mysgl 协议，说明是 3306 端
2) 省略协议:
//主机:端口/资源路径 协议采用和当前资源同样的请求协议
//127.0.0.1:8080/2022/12/31/a.html 资源 和 当前资源 处于同一个 web 服务器管理下:
3) 只写资源路径 (省略协议 + 主机) 当前 web 服务器下的其他资源
绝对路径，以/开头 /index.html /2023/01/z.html
相对路径，不是以，开头 a.html ./a.html ../../index.html
备注:当请求的不是同一个 Web服务器管理的资源时，可能遇到别人的防盗链限制，使得我们无法使用别的资源.
1.2.3超链接
显示内容，只会显示“显示内容”，点击能跳转地址。
1.2.4target
该属性指定在何处显示链接的资源。取值为标签 (tab)，窗口 (window) ，或框架 (iframe) 等浏览上下文的名称或其他关键词。以下关键字具有特殊的意义:
_self:当前页面加载，即当前的响应到同一 HTML 4 frame (或 HTML5 浏览上下文) 。此值是默认的，如果没有指定属性的话。
_blank:新窗口打开，即到一个新的未命名的 HTML4 窗口或 HTML5 浏览器上下文。
_parent:加载响应到当前框架的 HTML4 父框架或当前的 HTML5 浏览上下文的父浏览上下文。如果没有 parent 框架或者浏览,上下文，此选项的行为方式与self 相同。
_top:IHTML4 中:加载的响应成完整的，原来的窗口，取消所有其它 frame。HTML5 中: 加载响
应进入顶层浏览上下文(即，浏览上下文，它是当前的一个的祖先，并且没有 parent) 。如果没有parent 框架或者浏览上下文，此选项的行为方式相同_self。
1.2.5表格相关的标签
table标签:表示整个表格。
tr:表示表格的一行。
td:表示一个单元格。
th:表示表头单元格会居中加粗。
thead: 表格的头部区域(注意和th 区分范围是比th 要大的)。
tbody表格得到主体区域
table包含tr,tr包含td 或者 th。。
无论是 thead、tbody、 tfoot 都是先有 表行 (tr table row) 组成。
每一行里，又有多列组成，其中 thead 中的列使用 (th) 表示，tbody 中的列由 (td) 表示
表格演示
姓名 年龄 成绩 语文 数学 英语 张三 28 3 5 7 李四 25 7 3 6 总计 10 8 13
1.2.6 列表标签
1）有序列表(ordered list
- )
- 把油锅里倒
- 把肉锅里放
- 炖 10 分钟
- 出锅装盘
- )
备注: ol/ul 的孩子必须是 li 标签，
- 标签之下，可以跟任意的元素
列表 某个菜谱
需要的材料
具体表现在并没有自动标注了序号，每个标签前面有一个小圆点。
3）描述列表
HTML
元素(或 HTML 述列表元素)是一个包含术语定义以及描述的列表，通常用于展示词汇表或者元数据(键 - 值对列表)。 小结
上述讲述的所有标签，都是单方面的信息传递: 从服务器到客户端(浏览器)的传递。
但是在实际 web 场景中，经需要从 浏览器向服务器去传递一些信息(这些信息大部分来自用户的输入
比如:登录、注册场景下: 用户名 + 密码 用户输入-> 浏览器收集 -> 传递给服务器做下一步动作
使用 CSDN、B 站、痘印这种 UGC 场景: 内容 (博客 (文字) 、视频、音频)
UGC: User Generate Content 用户生成内容
用户输入 -> 浏览器收集 -> 传递给服务器做下一步动作。
1.2.7表单标签
平时填的各种表格、单子。
1、理解表单的整体流程:
1) 先发起一次请求，得到 要去填写的 表单
2)填写信息 + 点击提交(有其他提交方式): 再次发起一次请求，携带用户填写的信息到服务器
新的请求的 URL，由
4、时序图（用来描述多个参与活动的角色，在活动中的前后次序形式体现的职责时非常好用）
（1）经由某些方式让浏览器去请求某个资源获取表单信息我们暂时采用的方式是在地址栏输入地址。
（2）浏览器发起请求例/form.html请求资源
（3）服务器返回对应路径的资源内容
（4）在刘览器上显示表单给用户
（5）用户根据、表单的要求填写各种信息。
（6）浏览器收集用户填写的信息拼装成 key-value 的格式将所有数据，经过一次新的请求发送给服务器，这次新的请求的资源路径根据
列表
某个菜谱
做菜步骤
具体表现在并没有标注序号但是自动标注了序号。
2）无序列表 (unordered list
- )
列表项 (列表中的一个元素)(list item