チョコパイを240こ食べたエンジニア

PHPエンジニアをやった後、現在はフロントエンドエンジニアに・・。好物は『チョコパイと焼き鳥』。Twitterは@chooringo(ちょうりんご)

HTML5のEdits~ins要素とdel要素~

素人が書く備忘録
基本的にはHTML 5.2を元に記載。

edits関連

ドキュメントへの編集を表す。

ins要素

ドキュメントへの追加を表す。
暗黙の段落境界を越えて要素を配置してはいけない。

<ul>
    <li>とちおとめ</li>
    <li>あまおう</li>
    <li><ins datetime="2019-04-13 00:00Z">スカイベリー</ins></li>
</ul>

chromeで表示したとき
f:id:chooringo:20190413141638p:plain

カテゴリ
・フローコンテンツ
・フレージングコンテンツ
・パルパブルコンテンツ

コンテンツモデル
・トランスペアレント

コンテンツ属性
・グローバル属性
・cite - 引用元または編集に関する詳細情報へのリンク
・datetime - 変更した日付と時刻(オプション)

タグの記載場所
・フレージングコンテンツを配置できる場所

del要素

ドキュメントからの削除を表す。
暗黙の段落境界を越えて要素を配置してはいけない。

<ul>
    <li><del datetime="2019-04-13 00:00Z">玄関掃除</del></li>
    <li><del datetime="2019-04-13 00:00Z">網戸とサッシ掃除</del></li>
    <li>掃除機がけ</li>
    <li>雑巾がけ</li>
    <li>壁パタリング</li>
</ul>

chromeで表示したとき
f:id:chooringo:20190413145901p:plain

カテゴリ
・フローコンテンツ
・フレージングコンテンツ

コンテンツモデル
・トランスペアレント

コンテンツ属性
・グローバル属性
・cite - 引用元または編集に関する詳細情報へのリンク
・datetime - 変更した日付と時刻(オプション)

タグの記載場所
・フレージングコンテンツが配置できる場所