<time>

<time> は CSS のデータ型で、時間の値を秒単位またはミリ秒単位で表現します。これは animation や transition および関連するプロパティで使用されています。

構文

<time> データ型は、 <number> の直後に下記の単位を続けます。省略可能ですが、その前に単一の + または - を付けることもあります。どの単位の場合も、単位と数字との間には空白を置きません。

メモ: 数値の 0 は単にに関わらず常に同じですが、単位は省略できません。言い換えれば、 0 は無効であり、 0s または 0ms を表すものではありません。

単位

s
秒単位の時間を表します。例: 0s, 1.5s, -60s
ms
ミリ秒単位の時間を表します。例: 0ms, 150.25ms, -60000ms

メモ: s と ms の間の変換は、論理的に 1s = 1000ms となります。

例

正しい時間

12s         正の整数
-456ms      負の整数
4.3ms       整数でない数値
14mS        単位では大文字小文字が区別されませんが、大文字は推奨されません。
+0s         先導する + と単位を伴うゼロです
-0ms        先導する - と単位を伴うゼロです

正しくない時間

0           単位なしのゼロは <length> では使えますが、他のすべての単位では無効です。
12.0        これは <number> で <time> ではありません。単位が必須です。
7 ms        <number> と単位の間に空白を置いてはいけません。

仕様書

仕様書 状態 備考
CSS Values and Units Module Level 4
<time> の定義		 編集者草案
CSS Values and Units Module Level 3
<time> の定義		 勧告候補 s と ms の正規の定義
CSS Level 2 (Revision 1)
<time> の定義		 勧告 s と ms の非公式な定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
<time>Chrome 完全対応 1Edge 完全対応 12Firefox 完全対応 4IE 完全対応 9Opera 完全対応 10.1Safari 完全対応 3.1WebView Android 完全対応 2Chrome Android 完全対応 18Firefox Android 完全対応 4Opera Android 完全対応 10.1Safari iOS 完全対応 2Samsung Internet Android 完全対応 1.0

凡例

完全対応  
完全対応
関連トピック