AI问答-HTML：行内元素/Inline Elements、块级元素/Block-level Elements、inline-block 元素、空元素/Void Elements...

一、行内元素、块级元素、inline-block 元素、空元素

特性	行内元素（Inline）	块级元素（Block-level）	空元素（Void）	inline-block
定义	行内元素不会独占一行，与其他行内元素在同一行显示，直到行被填满才会换行。其宽度和高度由内容决定，无法通过 CSS 直接设置。	块级元素会独占一行，默认宽度填满父元素的宽度。可以设置 width、height、margin 和 padding，并且会影响其他元素的布局。	空元素没有闭合标签，通常不包含内容，用于插入特定的功能或资源。它们没有子节点，也无法包含其他元素。	inline-block 元素结合了行内元素和块级元素的特点。它不会独占一行，可以与其他元素排列在同一行内，同时可以设置 width、height、margin 和 padding。
常见元素	<span>、<a>、<strong>、<em>、<img>（默认情况下）、<input>（默认情况下）等	<div>、<p>、<h1> 到 <h6>、<ul>、<ol>、<li>、<table>、<form> 等	<img>、<br>、<input>、<hr>、<meta> 等	通过 CSS 设置 display: inline-block 的元素，如 <img>、<input>（默认情况下是 inline-block）等
是否独占一行	否	是	否（通常不包含内容）	否
宽度设置	无效，由内容决定	可以设置	通常由属性或 CSS 决定	可以设置
高度设置	无效，由内容决定	可以设置	通常由属性或 CSS 决定	可以设置
水平方向边距	生效	生效	通常由属性或 CSS 决定	生效
垂直方向边距	部分生效（不影响其他元素布局）	生效	通常由属性或 CSS 决定	生效
包含子元素	仅能包含文本或其他行内元素	可以包含块级元素和行内元素	无子节点	可以包含文本或其他行内元素
典型用途	文本修饰、小范围样式控制	构建网页结构和布局	插入特定功能或资源	水平导航栏、网格布局等

二、其他元素分类

分类	特点	常见元素
替换元素	内容由外部资源或浏览器替换，具有默认尺寸	<img>、<input>、<video>、<canvas>、<iframe>
可变元素	显示类型可切换，依赖上下文或 CSS	<button>、<textarea>、<select>
弹性/网格元素	布局由父容器决定，通过 Flexbox 或 Grid 属性控制	Flexbox/Grid 的子元素
列表项元素	默认是 list-item，由父列表决定布局	<li>
表格相关元素	布局由表格算法决定，具有特殊对齐和边框行为	<table>、<tr>、<td>、<th>
隐藏元素	通过 CSS 隐藏，不占据空间或仍占据空间	display: none 或 visibility: hidden 的元素
绝对/固定定位元素	脱离文档流，相对于父元素或视口定位	position: absolute 或 position: fixed 的元素
浮动元素	脱离文档流，向左或向右浮动，可能影响父元素高度	float: left 或 float: right 的元素
匿名块级盒子	自动生成，包裹行内元素中的块级内容	浏览器自动生成
特殊用途元素	具有特殊功能，默认不渲染内容	<script>、<link>、<meta>、<base>