标签在 html5 中已彻底删除,浏览器将其视为未知元素并退化为 ;应改用语义化、可访问性完备的 替代,且 dir 属性与 标签无关。

<dir></dir> 标签在现代 HTML 中已完全无效,不能用于新项目,也不该出现在任何 HTML5 文档中。
为什么 <dir></dir> 会被浏览器忽略
HTML5 规范直接移除了对 <dir></dir> 的支持,不是“不推荐”,而是“不解析”:遇到该标签时,主流浏览器(Chrome、Firefox、Safari、Edge)会当作未知元素处理,通常退化为 <div> 行为,子元素 <code><li> 也可能丢失列表语义或样式。
- HTML 4.01 就已标记为“已废弃”,HTML5 彻底删除其定义
- 没有对应的 DOM 接口支持(
document.createElement('dir')创建的是 HTMLUnknownElement) - 即使写成
<dir compact></dir>,所有现代浏览器都无视compact属性
<ul></ul> 是唯一合规且等效的替代方案
<ul></ul> 不仅功能一致,还提供完整语义、可访问性支持和 CSS 控制力。它和 <dir></dir> 在视觉上本就几乎无差别(都是无序项),但 <ul></ul> 是标准路径:
- 屏幕阅读器能正确识别
<ul><li></ul>结构并播报“列表,共 N 项” - 支持嵌套任意内容(如链接、图片、段落),而
<dir></dir>只允许直接子元素为<li> - CSS 中可用
list-style-type精确控制符号(disc/circle/square),也可用list-style-image或伪元素自定义 - 配合
role="navigation"或包裹在<nav></nav>中,可明确表达导航目录意图
dir 属性和 <dir></dir> 标签毫无关系
这是最常混淆的点:dir 是一个全局 HTML 属性,用于设置文本方向(dir="ltr" 或 dir="rtl"),至今有效且关键;而 <dir></dir> 是早已消失的标签,二者名字巧合,但语法、用途、生命周期完全不同。
- 错误写法:
<dir dir="rtl"><li>项目</li></dir>—— 外层<dir></dir>不被识别,dir属性也因父元素非法而失效 - 正确写法:
<ul dir="rtl"><li>项目</li></ul>——dir属性作用于标准元素,行为可靠 - 若需目录结构语义(如文档大纲),优先用
<nav><ol></ol></nav>(有序更体现层级),而非强行复用过时标签
真正容易被忽略的是:很多旧项目或 CMS 模板仍残留 <dir></dir>,但它们在无障碍检测工具(如 axe、Lighthouse)中会直接报“未知元素”,且无法通过 ARIA 扩展修复——因为底层已被浏览器丢弃,不是样式问题,是解析失败。











