HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<time>
日付と時刻を表す要素。機械が読み取れる形式で日時を指定します。
info
概要
<time> 要素は、人間が読むことができる形式の日付、時刻、または期間をマークアップし、同時に datetime 属性を使用して機械が読み取れる形式(ISO 8601形式)を提供します。
検索エンジンやブラウザ、スクリーンリーダーなどのソフトウェアに正確な日時を伝えるために使用されます。
play_circle
デモ (静的表示)
HTML (Source)
<p>
イベント開催日: <time datetime="2026-04-01T19:00">2026年4月1日 19:00</time>
</p>
<p>
記事の更新日: <time datetime="2025-12-14">昨日</time>
</p>
Preview (Result)
イベント開催日:
記事の更新日:
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| datetime | 機械可読な日付または時刻の値を指定します。ISO 8601形式に従う必要があります。この属性は、要素内に表示される人間可読な値よりも優先されます。 |
code
実用例
1. 特定の日付
<p>
弊社は<time datetime="2020-01-01">2020年元日</time>に設立されました。
</p>
2. 特定の時刻とタイムゾーン(Tは区切り文字)
<p>
会議は<time datetime="2026-01-20T20:00:00+09:00">午後8時</time>に始まります。
</p>
3. 年月のみ
<p>
契約期間は<time datetime="2025-10">2025年10月</time>までです。
</p>
4. 期間(datetime属性がない場合)
<p>
作業時間は<time>約2週間</time>を予定しています。
</p>
lightbulb
知っておくべき重要事項
alarm
ISO 8601 形式の重要性
datetime 属性の値は、必ずISO 8601の標準形式に従う必要があります(例: YYYY-MM-DD、YYYY-MM-DDThh:mm:ssZ)。これにより、機械が曖昧さなく正確な日時を理解できます。
accessibility_new
アクセシビリティ
<time> 要素の内部テキスト(人間が読む部分)は、ユーザーにとって理解しやすく、文脈に合ったものでなければなりません。例えば、「2025年12月14日」は人間可読で、「2025-12-14」が機械可読な datetime の値となります。