HTML5タグリファレンス
data

投稿 | | カテゴリー タグリファレンス, HTML5
HTML5で追加

<data>要素は、その内容をvalue属性でコンピュータが判読可能な書式による値を表します。value属性がなくてはなりません。

<data>要素は、いくつかの目的のために使用することができます。例えばmicroformatsmicrodataなどの構造化データでは、マシンが判読可能な書式のvalue属性と人間が判読可能な内容の両方を提供することもできます。この場合、value属性で使用されるフォーマットは、使用中の構造化データのボキャブラリによって決まります。

値が日付や時刻などに関連する場合は、より具体的な<time>要素を使用できます。


カテゴリ
フロー・コンテンツ、フレージング・コンテンツ、パルパブル・コンテンツ
配置場所
フレージング・コンテンツが置ける場所。
内容
フレージング・コンテンツ
属性
value="マシンが判読可能な値"

コンピュータが読み取り可能なフォーマットの値を指定します。

グローバル属性

accesskey, class, contenteditable, data-*, dir, hidden, id, lang, spellcheck, style, tabindex, title, translate

サンプル

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>HTML5 › data</title>
</head>
<body>
<h1>HTML5 › data</h1>
<article itemscope itemtype="http://n.example.org/rfc4287">
<h2 itemprop="title">求む、ステロイド軟膏</h2>
<footer>
公開:<time itemprop="published" datetime="2017-08-28">2日前</time>

<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
<img src="//emwai.jp/img/avatar.png" alt="筆者画像">
<data value="url">//emwai.jp/img/avatar.png</data>
<data value="width">128</data>
<data value="height">128</data>
</span>

</footer>
<p itemprop="content">いやぁ、今日は股間がカユくてドコにも行きたくないよ。</p>
</article>
</body>
</html>

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれないコメントは無視されますのでご注意ください。(スパム対策)