一、基础特性与规范

1. 技术定位：HTML 是前端技术栈的核心标记语言，用于构建网页的结构。
2. 嵌套规则：标签嵌套必须遵循层级关系，不能交叉（如正确：<div><p></p></div>；错误：<div><p></div></p>）。
3. 大小写特性：HTML 标签大小写无关（如 <div> 与 <DIV> 效果一致），但推荐使用小写以符合规范。
4. 路径与协议规则：
   • 引用外部资源（如其他网站的图片、脚本）时，必须加上协议（如 http:// 或 https://）。
   • 网站内部资源使用相对路径时，无需加协议（如 ./images/logo.png 表示当前目录下的资源）。
5. 特殊符号与换行：
   • 文字中若需显示 % 符号，直接书写即可；若需换行，需使用 <br> 标签（如 第一行<br>第二行）。
6. 注释语法：使用 <!-- 注释内容 --> 进行注释，注释内容不会在页面中显示。

二、页面元素与布局

1. 超链接：
   • 文字超链接：<a href="目标地址">链接文字</a>
   • 图片超链接：<a href="目标地址"><img src="图片路径"></a>
2. 路径表示：../ 表示回退到上一级目录（如 ../css/style.css 表示上一级目录中 css 文件夹下的 style.css）。
3. Div 布局：使用 <div align="center">内容</div> 可使 div 内的内容居中显示（注：现代布局更推荐使用 CSS 替代 align 属性）。
4. 表格元素：
   • <table>：定义表格
   • <tr>：定义表格行
   • <th>：定义表头单元格（默认加粗居中）
   • <td>：定义表格数据单元格
   • 示例：

     <table><tr><th>表头1</th><th>表头2</th></tr><tr><td>数据1</td><td>数据2</td></tr>
     </table>
     

5. 边框：通过 border 属性为元素添加边框（如 <table border="1"> 表示表格添加 1px 边框）。

三、交互与表单

1. 表单基础：<form action="处理数据的后端地址"> 用于定义表单，action 属性指定表单数据提交的目标地址。
2. Input 输入控件（通过 name 属性定义变量名，用于后端接收数据）：
   • text：明码文本输入（如 <input type="text" name="username">）
   • password：掩码密码输入（输入内容显示为圆点或星号，如 <input type="password" name="pwd">）
   • submit：提交按钮（点击提交表单，如 <input type="submit" value="登录">）
   • radio：单选按钮（name 相同的 radio 为一组，只能选一个，如：

     <input type="radio" name="gender" value="male">男
     <input type="radio" name="gender" value="female">女
     

   • checkbox：复选框（可多选，如 <input type="checkbox" name="hobby" value="reading">阅读）
3. 下拉菜单：
   • <select name="变量名"> 定义下拉列表，name 为后端接收的变量名
   • <option value="提交值">显示文本</option> 定义下拉选项，提交到后端的数据是 value 属性的值（而非显示文本）
   • 示例：

     <select name="city"><option value="beijing">北京</option><option value="shanghai">上海</option>
     </select>
     

     若选择“北京”，后端接收的 city 变量值为 beijing。

四、网络通信基础流程（以浏览器访问网页为例）

1. DNS 解析（域名 → IP）

   • 作用：将域名（如 www.example.com ）转换为IP 地址，让网络找到目标主机。
   • 关键：域名是 IP 的“别名”，方便记忆；本机回环地址可用 localhost 或 127.0.0.1 指代。

2. TCP 连接建立

   • 依赖：IP（定位主机） + 端口（定位主机内的应用），端口占 2 字节（范围 0 - 65535 ）。
   • 常见端口：
     • 熟知端口（可省略显式指定）：如 HTTP 的 80 端口、HTTPS 的 443 端口。
     • 应用端口：自定义服务端口（如 8080、3000 等）。
   • 流程：通过三次握手建立 TCP 连接，为 HTTP 通信提供可靠传输通道。

3. HTTP 请求 - 响应

   • 协议定位：HTTP 是应用层协议，规范客户端（浏览器）与服务器的通信规则，采用客户端 - 服务器模型。
   • 无状态性：每次请求独立，服务器不主动保留客户端状态（需 Cookie、Session 等机制补充）。
   • 请求流程：
     • 请求报文：
       • 结构：请求行（方法 + URL + 版本，如 GET /index.html HTTP/1.1 ） + 消息头（多行键值对，如 User-Agent 、Cookie ） + 空行 + 请求体（POST 等方法用，放表单数据等）。
       • 方法：GET（获取资源，参数放 URL，体为空）、POST（提交数据，参数放体，更安全）。
     • 响应报文：
       • 结构：状态行（版本 + 状态码 + 描述，如 HTTP/1.1 200 OK ） + 消息头（如 Content-Type 、Content-Length ） + 空行 + 响应体（返回的 HTML、JSON 等内容）。
     • 连接优化：Keep-Alive 模式下，TCP 连接可复用，减少重复建立连接的开销。

4. 页面渲染与连接关闭

   • 浏览器行为：收到响应体（HTML 等）后，边解析边执行渲染，加载 CSS、JS、图片等资源。
   • 连接关闭：通过四次挥手关闭 TCP 连接（或因 Keep-Alive 保持，等待超时后关闭 ）。

五、配套技术与工具

1. Web 服务器与配置

   • 核心：Web 服务器（如 Tomcat、Nginx ）通过配置文件（如 Tomcat 的 web.xml 、Nginx 的 .conf 文件 ）定义服务规则。
   • 作用：配置文件告诉 Web 服务器如何处理请求（如路由规则、资源映射、安全策略 ）。

2. 网络安全与管理

   • 漏洞扫描：通过工具（如 Nmap、OpenVAS ）探测网络服务、应用的漏洞，提前发现风险。
   • CISP（注册信息安全专业人员）：聚焦信息安全领域的认证，涉及网络安全架构、风险评估、合规等知识，用于指导企业/个人保障网络通信与系统安全。

六、知识关联图（简化版）