块级元素
核心特点
- 独占一行：无论内容多少，块级元素默认会占据父容器的整行空间，其后的元素会被挤到下一行显示；
- 可自定义宽高：能通过
width/height设置宽度和高度，默认宽度为父容器的 100%，高度由内容撑开； - 内外边距全生效：
margin（上下左右）、padding（上下左右）的设置都会完全生效，可通过内外边距调整元素位置和间距； - 可嵌套特性：支持嵌套其他块级元素或行内元素（部分块级元素有语义限制，如
p不能嵌套div等块级元素）； - 默认垂直排列：多个块级元素并列时，默认从上到下垂直排布。
本专栏中涉及的块级元素及场景特点
- 结构类（
html/head/body/title）：作为页面根结构，html包裹所有内容，head存非可视化元信息，body承载可视内容，均独占对应层级的整行空间； - 布局类（
div/header/nav/main/section/article/aside/footer等）：核心用于搭建页面布局，可自由设置宽高和边距，是页面结构的核心载体； - 文本类（
h1-h6/p/address/blockquote/pre）：h1-h6作为标题独占一行且自带默认上下间距，p段落默认上下留白，pre保留文本格式且独占一行； - 列表类（
ul/ol/dl/li/dt/dd）：ul/ol整体独占一行，li作为列表项默认垂直排列，dl/dt/dd组合形成自定义列表，均独占对应行； - 表格类（
table/caption/colgroup/thead/tbody/tfoot/tr）：table整体可设宽高，内部tr行独占表格一行，caption作为表格标题独占表格上方整行； - 表单类（
form/fieldset/legend/textarea/select/optgroup）：form包裹整个表单独占一行，textarea可设行列数（本质是宽高），select整体独占一行； - 其他（
hr/hgroup/details/dialog/search）：hr作为水平线独占一行且撑满父容器宽度，dialog弹窗默认独占页面层叠空间，可设宽高。
行内元素
核心特点
- 同行显示：不独占一行，能和其他行内元素、文本在同一行并列显示，宽度仅由自身内容（文字 / 嵌套行内元素）决定；
- 不可自定义宽高：设置
width/height无效，宽高完全由内容撑开，无法通过尺寸属性调整； - 内外边距有限生效：
padding/margin的水平方向（左 / 右）生效，垂直方向（上 / 下）仅会影响自身视觉位置，但不会推开周围元素（即不会改变其他元素的布局）； - 对齐特性：默认与基线（文字底部）对齐，可通过
vertical-align调整对齐方式； - 嵌套限制：仅能嵌套其他行内元素，不能嵌套块级元素（如
span不能嵌套div）。
本专栏中涉及的行内元素及场景特点
- 通用类（
span）：无语义的行内容器，仅用于包裹行内文本 / 元素，方便样式控制，宽高随内容变化； - 文本样式类（
strong/b/em/i/del/s/ins/u/sup/sub/mark）：仅修改文本样式（加粗 / 倾斜 / 删除线 / 上下标等），不改变行内显示特性，与其他文本同行； - 链接 / 引用类（
a/q/cite/abbr）：a超链接可跳转，同行显示且仅能通过padding/margin调整水平间距；q短引用自带引号，与文本同行； - 代码 / 标注类（
code/var/time/data）：code显示单行代码，time标注时间，均为行内显示，宽高由内容决定； - 表单相关（
label/output）：label绑定表单控件，与控件同行显示；output展示计算结果，行内排布； - 特殊行内（
br）：仅用于换行，无内容、无宽高，是行内元素中唯一强制换行的标签。
行内块元素
核心特点
-
兼具行内 + 块级特性：
- 行内特性：可与行内元素 / 文本同行显示，多个行内块元素可并列在同一行；
- 块级特性：能通过
width/height自定义宽高，margin/padding上下左右均完全生效；
-
默认对齐方式：默认与基线对齐（可通过
vertical-align调整为顶部 / 居中对齐）； -
空白间隙：多个行内块元素并列时，代码中的换行 / 空格会转化为页面上的空白间隙（需通过消除空格、设置父容器
font-size:0等方式解决）； -
宽高默认规则：未设置宽高时，宽度由内容 / 自身尺寸（如图片的原始尺寸）决定，高度同理。
本专栏中涉及的行内块元素及场景特点
- 媒体类（
img/video/audio）：img可设宽高且与文本同行显示（如图文混排），video/audio可自定义播放控件尺寸，同行排布时不独占一行； - 表单类（
input/button/progress/meter）：input各类输入框（文本 / 密码 / 单选 / 复选等）可设宽高，与label同行显示；button按钮可自定义尺寸，多个按钮可并列；progress进度条、meter度量条可设宽高，行内显示； - 表格类（
col/td/th）：td/th单元格可设宽高，且在表格行内并列显示；col定义列样式，行内块特性使其能适配表格列宽； - 其他（
datalist/option）：datalist配合input显示下拉提示，option作为下拉选项，均为行内块特性，可设尺寸且同行排布。
其他
特殊标签（无行内 / 块级严格划分）：如 meta/link/style/script/base/noscript 等，属于元标签 / 资源标签，不参与页面布局渲染，无宽高、无行内 / 块级显示特性，仅用于提供页面元信息、加载外部资源（CSS/JS）等。
