5.7.3 HTML
本课核心知识点整理
HTML 是网页的结构语言
HTML 是超文本标记语言，用标签描述网页内容结构。它不负责网络传输，传输靠 HTTP/HTTPS；它也不主要负责样式和交互，样式通常由 CSS 控制，交互通常由 JavaScript 控制。
| 技术 | 主要职责 |
|---|---|
| HTML | 页面结构和内容 |
| CSS | 样式、布局、字体、颜色 |
| JavaScript | 行为、交互、动态逻辑 |
标签结构
HTML 标签通常成对出现，结束标签带 /：
html
<b>加粗文字</b>
<title>页面标题</title>标签中间是内容，标签内部可以写属性：
html
<a href="https://example.com">访问示例网站</a>href 就是属性，用来指定超链接目标。
常见标签
| 标签 | 作用 |
|---|---|
<html> | HTML 文档根元素 |
<head> | 文档头部，放元信息 |
<title> | 页面标题，通常显示在浏览器标签页 |
<body> | 页面主体内容 |
<a> | 超链接 |
<b> | 加粗文本 |
<button> | 按钮 |
<table> | 表格 |
<tr> | 表格行 |
<td> | 表格单元格 |
<form> | 表单 |
<input> | 输入控件 |
<script> | 脚本 |
表格题要分清 table、tr、td：表格整体是 table，行是 tr，单元格是 td。
基本文档骨架
html
<html>
<head>
<title>页面标题</title>
</head>
<body>
<a href="https://example.com">链接</a>
</body>
</html>课堂里特别提到，head 头部一般要有 title 标题；真正显示在页面主体中的内容放在 body 中。
CSS 的引入方式
CSS 可以通过多种方式作用于 HTML：
| 方式 | 示例 | 特点 |
|---|---|---|
| 行内样式 | <p style="color:red">文本</p> | 写在标签属性里 |
| 内部样式 | <style>p { color:red; }</style> | 写在页面内部 |
| 外部链接 | <link rel="stylesheet" href="style.css"> | 引入独立 CSS 文件 |
@import | @import url("style.css"); | 在 CSS 中导入其他样式 |
考试里曾考“不正确的 CSS 引入方式”。字幕提醒：注释不会执行，也不会显示，所以把 CSS 写在注释里不能真正引入样式。
html
<!-- <link rel="stylesheet" href="style.css"> -->上面这行只是注释，不会加载 CSS。
例题
描述网页内容结构的标记语言是：
HTML 中用于创建超链接的标签是：
下列方式中，不能真正引入 CSS 样式的是：
自查要点
- HTML、CSS、JavaScript 的职责有什么区别？
- 开始标签和结束标签有什么区别？
<head>、<title>、<body>分别放什么？- 表格中的
table、tr、td分别表示什么？ - 为什么注释中的 CSS 引入代码不会生效？