教材：黑马程序员《HTML5+CSS3 网页设计与制作（第 2 版）》，人民邮电出版社，ISBN 978-7-115-65341-3，共 12 章，271 页。
括号里是页码，方便对着书翻。⚠️ 是必考/必错点。
注意：这本教材没有 flex 布局（第 8 章讲的是浮动 + 定位 + 三列布局），考试按书走；flex 放最后当补充。
<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><title>标题</title></head>
<body>内容</body>
</html>
id、class、style、title）<meta>、<title>、<link>、<style>、<script>h1~h6、p、br、hr、strong/em、del/ins、sub/sup < > © &<img src alt title width height>；常见格式 GIF/JPEG/PNG考点：块级/行内/行内块区别；实体字符；img 的 alt 作用。
style、内部 <style>、外部 <link rel="stylesheet" href="...">（推荐）、@import（了解）.、id #、通配 *、并集 ,font-family/size/weight/style、font 简写color/text-align/text-decoration/text-indent/line-height/letter-spacing>、交集（p.one）、并集 ,、伪类 :hover/:focus/:active!important > 行内 > id(100) > 类/伪类/属性(10) > 标签(1) > 通配(0)考点：三种引入方式区别；优先级计算题；哪些属性可继承。
E[attr]、E[attr^=value]（开头）、E[attr$=value]（结尾）、E[attr*=value]（包含）>、相邻兄弟 +、通用兄弟 ~:root、:not(选择器)、:only-child、:empty:first-child / :last-child / :nth-child(n) / :nth-last-child(n):first-of-type / :last-of-type / :nth-of-type(n) / :nth-last-of-type(n)nth-child 是「先数位置再看类型」，nth-of-type 是「先按类型再数」::before、::after（必须写 content）考点：nth-child(n) 的 n 写法（2n、odd、even、3n+1）；伪元素与伪类的区别。
border-width/style/color、border 简写、border-collapse（表格）、圆角 border-radiuspadding、外边距 margin（margin: 0 auto 水平居中）background-color/image/repeat/position/sizewidth/height（默认指内容区）opacity 透明度、圆角、图像边框、box-shadow、text-shadow、渐变 linear-gradient/radial-gradient、多背景display: block/inline/inline-block/none；<div> 与 <span>计算题（必考）：
默认 content-box：盒子总宽 = width + padding×2 + border×2
box-sizing: border-box：width 已含 padding 和 border
ul>li、有序列表 ol>li、定义列表 dl>dt+dd、列表嵌套list-style-type / image / position、list-style 简写<a href target>；锚点链接 #id ⚠️:link → :visited → :hover → :active（顺序不能乱）table > caption/thead/tbody/tfoot > tr > th/td；rowspan 跨行、colspan 跨列 ⚠️border-collapse、text-align、vertical-align<form action method>、表单控件、提示信息<input type="text/password/radio/checkbox/file/submit/reset/button/hidden/image">；name/value/checked/disabled/readonly/maxlength<textarea>、<select><option>、<label for>placeholder、required、autofocus、autocomplete、multiple、novalidateleft/right；脱标、不占位置、父元素高度塌陷clear:both 额外标签、父级 overflow:hidden、::after 伪元素（推荐）、双伪元素static（默认）、relative（参照自身，不脱标）、absolute（参照最近定位祖先，脱标）、fixed（参照视口）z-index（定位元素才有层级）overflow：visible/hidden/scroll/autoheader/nav/section/article/aside/footer代码题：三列布局、清除浮动、居中、导航栏。
<video src controls autoplay loop poster>、<audio><source> 多格式 ⚠️transition-property / duration / timing-function / delay、transition 简写（需要触发条件，如 hover）translate()、rotate()、scale()、skew()translate3d、rotateX/Y、perspective、transform-style: preserve-3d@keyframes 名字 { 0%{} 50%{} 100%{} }animation-name / duration / timing-function / delay / iteration-count / direction / fill-mode / play-stateanimation 简写document 对象（简单操作）<canvas id width height>、getContext("2d")、moveTo/lineTo/stroke、fillStyle、arc（画圆）document.cookie（4KB，随请求发送）、localStorage（永久，约 5MB）、sessionStorage（会话级）setItem/getItem/removeItem/clear、JSON.stringify/parsedisplay:flex、justify-content、align-items、flex:1@media、移动端 viewport / rem 适配overflow:hidden 触发块级格式化上下文，可清除浮动、防止 margin 合并）如果老师讲了 flex，就按「盒模型 → 浮动定位 → flex」的顺序补；如果没讲，跳过。
| 题 | 章 |
|---|---|
| Web 标准三层分别是什么 | 1 |
| 块级、行内、行内块元素区别 | 2 |
| 引入 CSS 的三种方式及区别 | 3 |
| 选择器优先级计算 | 3 |
| CSS 的继承性与层叠性 | 3 |
nth-child 与 nth-of-type 区别 | 4 |
| 伪元素与伪类的区别 | 4 |
盒模型组成；box-sizing 作用 | 5 |
| 垂直外边距合并的情形 | 5 |
| 链接伪类 LVHA 顺序 | 6 |
rowspan 与 colspan | 7 |
| 浮动原理、清除浮动的方法 | 8 |
| 定位的四种方式及参照物 | 8 |
| 单列/两列/三列布局思路 | 8 |
| HTML5 结构标签 | 8 |
| video/audio 常用属性 | 9 |
| transition 与 animation 的区别 | 10 |
| 2D 与 3D 变形 | 10 |
| localStorage 与 cookie 区别 | 11 |