どんなタグ？
日付または時刻を表す場合に
<time>タグを使う

<p>
 私は<time datetime="2020-01">正月</time>にShibajukuに入りました。
</p>
  

time (タイム)要素は <time> 〜 </time> タグで挟んだ箇所が日付や時刻、経過時間であることを示します。HTML5から使用できるようになりました。 注意点として、datetime属性がなければtime要素の内容は日時として扱われ、その日時を表すテキストはコンピュータが取り扱える形式で記述する必要があります。 datetime属性を付けることで、「今日」「明日」といった人間が理解できる日付や時刻の記述することができます。

どのカテゴリに属しているの？

time要素は フロー・コンテンツ, フレージング・コンテンツ というコンテンツ・カテゴリに属しているタグです。

梱包できるタグは？

timeタグに梱包できる要素（コンテンツ・モデル）は、datetime 属性がある場合は、フレージング・コンテンツ、ない 場合はテキストのみ（ただし、コンピュータが取り扱える形式のみ） です。

コンピュータやブラウザに正確な日時を伝えるためのタグです。

どうやって使うの？
日付や時刻を表す記述を、
<time>タグで挟んで使います。

time (タイム)要素は、記事の公開日時やコンテンツ内の時間を表す記述などを <time> 〜 </time> で挟んで使用します。datetime属性を指定しない場合はコンピュータが取り扱える形式（時刻例：23:55:00、日付例：2020-03-19）で記述する必要があります。datetime属性を指定すれば、「2020年夏」など、文章での日付を記述することが可能です。なので基本的にdatetime属性を指定して使用することが多いです。

使い方

<time datetime="yyyy-mm-dd">
  日付や時刻を表す記述
</time>

<section>
 <h2>ブログ一覧</h2>
 <article>
  <h3><a href="#">プロが教える！おいしいコーヒー豆の選び方</a></h3>
  <p><time datetime="2019-12-10">2019年12月10日</time></p>
 </article>
 <article>
  <h3><a href="#"><time datetime="2019">2019年</time>〜<time datetime="2020">2020年</time>の年末年始のお休みについて</a></h3>
  <p><time datetime="2019-12-1">2019年12月1日</time></p>
 </article>
</section>

どこでも使えるの？

time要素は フロー・コンテンツもしくはフレージング・コンテンツが配置できるところならどこでも使えます。

気をつけることは？

time要素は、datetime属性を指定しないと記述が制限されるので注意して下さい。

日付や時刻を伝えるためのタグです。

使える属性は？
グローバル属性とdatetime属性です。

<time> タグには、どの要素にでも使えるグローバル属性とdatetime属性が使えます。

基本的にdatetime属性を指定して使用します。

サンプルが見たい
<time>タグを使ったサンプルを
いくつか紹介。

<time>タグを使ったサンプルを紹介します。

基本的な<time>タグのサンプル

<section>
 <h2>ニュース一覧</h2>
 <article>
  <h3><a href="#">Shibajukuの新コンテンツ発表</a></h3>
  <p><time datetime="2020-03-19">今日</time></p>
 </article>
 <article>
  <h3><a href="#">オンラインもくもく会を開催</a></h3>
  <p><time datetime="2020-03-18">昨日</time></p>
 </article>
</section>

ニュース一覧やブログ一覧の日付部分によく使います。

デフォルトスタイルは？
ありません。

一般的なブラウザでtime要素を表示した場合、デフォルトスタイルは特にありません。

time要素はデフォルトスタイルを気にする必要はありません。

対応ブラウザは？
基本的にどのブラウザでも
大丈夫。

<time>タグは HTML5以降で利用可能で、主に以下のブラウザが対応しています。

Internet Explorar

Internet Explorar 9 ~

Edge

Edge 有り

Google Chrome

Google Chrome 有り

Firefox

Firefox 有り

Safari

Safari 有り

Opera

Opera 有り

どのブラウザでも問題ありません。