该用 <ul> 而不是 <ol> 时，关键看项目是否并列无序：若互换位置不影响理解（如导航菜单、功能亮点），就用 <ul>；若存在必须遵循的逻辑顺序或执行步骤（如安装流程、法律条款），则必须用 <ol>。
什么时候该用 <ul> 而不是 <ol>
关键看项目之间有没有逻辑顺序或依赖关系。如果只是并列罗列、互换位置不影响理解，就用 <ul>；比如导航菜单、功能亮点、标签云。一旦存在“第一步→第二步→必须按此执行”的约束，就必须用 <ol>——浏览器和屏幕阅读器会据此播报“第1项、第2项”，而 <ul> 只会读作“列表项”。
常见错误是把教程步骤写成 <ul>，或者把 FAQ 标签用 <ol> 包裹。前者让辅助技术丢失流程线索，后者则暗示问题有优先级或时间先后，其实没有。
-
<ul>适合：nav内的链接、产品特性清单、相关文章推荐 -
<ol>适合：安装步骤、法律条款编号、搜索结果排名（带序号） - 别为了“看起来像编号”硬套
type="1"在<ul>上——语义错，CSS 也难对齐
<dl> 不是“装饰性列表”，而是语义容器
<dl> 的核心作用是表达“名-值对”，不是为了缩进排版。它常被误用为多列布局或伪表格，但这样会破坏可访问性：屏幕阅读器遇到 <dl> 会明确播报“术语：XXX，定义：YYY”，而 <ul> 套两层 <li> 则完全丢失这种映射关系。
典型正确场景包括参数说明文档、API 响应字段解释、FAQ 的问答对。注意 <dt> 和 <dd> 必须成对出现，且一个 <dt> 可对应多个 <dd>（比如一个术语有多个解释），但不能反过来。
立即学习“前端免费学习笔记（深入）”；
- 错误写法：
<dl><dt>尺寸</dt><dt>颜色</dt><dd>M</dd><dd>蓝</dd></dl>（两个<dt>连续，无对应关系） - 正确写法：
<dl><dt>尺寸</dt><dd>M</dd><dd>L</dd><dt>颜色</dt><dd>蓝</dd></dl> - CSS 控制时，
<dd>默认有左缩进，若需水平对齐，建议用display: flex或grid，而非强行重置margin
start、reversed、type 这些属性只对 <ol> 生效
这些是 <ol> 的专属控制项，<ul> 上设了也无效。比如 <ul start="5"> 不会从 5 开始计数，浏览器直接忽略；<ol type="square"> 也不会变成方块，而是继续用数字（除非你用 CSS 强制覆盖）。
实际中 start 最有用在分页列表的后续页（如第2页从第21条开始），reversed 适合倒计时步骤或降序排行榜。但要注意：若用 JavaScript 动态增删 <li>，这些属性不会自动重算序号，得手动更新 start 或改用 CSS counters。
-
type可选值："1"（默认）、"a"、"A"、"i"、"I"；不支持"disc"等<ul>的符号类型 -
reversed是布尔属性，写reversed即生效，不用reversed="true" - IE 低版本不支持
reversed，如需兼容，得用 JS 补充逻辑或改用 CSS
嵌套列表的语义边界容易模糊
嵌套本身合法，但每层都应保持语义一致。<ul> 里嵌 <ol> 没问题（比如“支持的格式”下再列“转换步骤”），但若外层是 <dl>，内层就不该突然塞个 <ul>——这会让辅助技术困惑：术语下面怎么冒出一串无序项目？
更隐蔽的问题是过度嵌套导致 DOM 层级过深，影响渲染性能和维护性。三层以上嵌套就该考虑是否该拆成独立模块或改用其他结构（如卡片+标题）。
- 合理嵌套：
<ul><li>前端框架<ul><li>React</li><li>Vue</li></ul></li></ul> - 语义断裂：
<dl><dt>部署流程</dt><dd><ol><li>准备服务器</li></ol></dd></dl>（<dd>里放完整有序流程，不如直接用<ol>） - CSS 重置时，
list-style: none会影响所有后代列表，如需保留子列表样式，得显式重写ul ul, ol ol等选择器
<ul> + CSS counter 模拟编号，也不该滥用 <ol> 破坏语义。浏览器和读屏软件不会因为“看起来像编号”就改变解析逻辑。 
