标签仅适用于明确可被机器解析的时间点或时间段，如文章发布日期、活动开始时间等；须用 datetime 属性提供符合 iso 8601 格式的标准时间值，且不可用于模糊表达或装饰性文本。
time 标签该用在哪些时间场景下
<time></time> 不是用来显示任意带数字的日期字符串的，它只适用于明确可被机器解析的时间点或时间段。比如文章发布日期、活动开始时间、视频录制时间这些有真实时间语义的场合才适合用。如果只是“第3季度”“上周五”这种模糊表达，或者纯装饰性的“2024年爆款时间”，<time></time> 反而会误导辅助技术或搜索引擎。
常见误用包括：<time>截止日期：2024-12-31</time>（“截止日期：”是文本，不是时间值本身）；<time>下午2点</time>（没带时区或日期，无法被可靠解析）。
正确做法是把纯时间数据作为 <time></time> 的文本内容，并通过 datetime 属性提供标准格式：
<time datetime="2024-06-15T14:30:00+08:00">6月15日下午2:30</time>
datetime 属性必须严格遵循 ISO 8601 格式
datetime 是 <time></time> 唯一有意义的属性，它的值不能随便写。浏览器和爬虫只认 ISO 8601，其他格式如 "2024/06/15"、"15-06-2024" 或中文 "2024年6月15日" 都会被忽略，相当于没写。
- 完整时间带时区：
datetime="2024-06-15T14:30:00+08:00"（推荐，尤其跨时区服务） - 只有日期：
datetime="2024-06-15"（合法，表示当天 00:00:00 UTC 开始的一整天） - 只有时间（不推荐）：
datetime="14:30"（无日期上下文，语义弱，多数工具不处理） - 时间段：
datetime="2024-06-15T14:30:00+08:00/2024-06-15T16:00:00+08:00"（用斜杠分隔起止）
不要指望 time 标签自动样式化或交互功能
<time></time> 是纯语义标签，浏览器不会给它加下划线、hover 效果，也不会弹出日历或转换时区。它既不替代 JavaScript 时间处理，也不自带格式化能力。
如果你需要用户点击后显示本地时间、支持时区切换，或者想让“Jun 15”自动变成“6月15日”，这些都得靠 JS 手动实现——<time></time> 只负责把原始时间数据干净地暴露给外部系统。
顺带一提：部分屏幕阅读器会读出 datetime 值（如“2024年6月15日，下午2点30分”），但依赖具体读屏软件配置，不能当作 UI 功能来设计。
SEO 和结构化数据里 time 标签的实际价值
Google 等搜索引擎确实会提取 <time datetime></time> 中的内容用于富媒体摘要（比如搜索结果里显示“Published: Jun 15, 2024”），但前提是它出现在合理上下文中——例如 <article></article> 里的 <header></header>，或事件卡片中的明确时间字段。
容易被忽略的是：单个页面多个 <time></time> 标签必须语义清晰区分。比如同时标“发布于”和“更新于”，就该用不同 class 或配合 ARIA label：
<time datetime="2024-06-10" class="published">6月10日</time><br><time datetime="2024-06-15" class="updated">6月15日</time>
否则结构化数据抽取可能混淆主次，导致 Rich Result 失效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
