ins タグと del タグの属性と使用法

ins タグと del タグの属性と使用法
insdel は、HTML 4.0 で導入され、文書の作成時に作成者が共同作業できるようにし、また、編集 (たとえば、作成者が一定期間にわたって文書をどのように変更したか、どのように考えたかを反映できます) とバージョン管理コンポーネント (ソフトウェアの助けを借りて、文書を特定の時点の状態に復元できます) を保持します。

ins 属性とdel 属性

cite : 属性値は、ドキュメントまたは情報リソースの URI です。この属性は、このドキュメントの説明が変更された理由を示すために使用されます。

datetime : 属性値は、変更が発生した日時を明確かつ詳細に説明します。


W3C による del と ins の説明:

INS と DEL は、文書の異なるバージョンに関して挿入または削除された文書のセクションをマークアップするために使用されます (例: 立法者が変更を確認する必要がある法案草案など)。

これら 2 つの要素は、ブロック レベル要素またはインライン要素のいずれか (両方ではない) として機能するという点で、HTML では珍しいものです。段落内に 1 つ以上の単語を含めたり、段落、リスト、表などの 1 つ以上のブロック レベル要素を含めたりすることができます。

del は文書内で削除されたテキスト コンテンツを定義し、ins は文書内の更新と修正を記述するために使用されます。del の既定のブラウザー スタイルは削除され、ins の既定のスタイルは下線付きです。これは、2 つの使用法をよく表しています。通常、2 つの要素は一緒に使用されます。

ins とdelの使用

HTML では、ins 要素と del 要素はブロックレベル要素またはインライン要素のいずれかになりますが、同時に両方になることはできません。したがって、段落内に 1 つまたは複数の単語を含めたり、段落 (p)、リスト (ul、ol、dl)、表 (table) などの複数のブロックレベル要素を含めたりすることができます。

<p>私は <del cite="http://www.baikelu.com/" datetime="20070515T192525+08:00">2</del><ins cite="http://www.baikelu.com/" datetime="20070515T192525+08:00">3</ins> セント</p>

<del title="たった今紛失" datetime="20070515T192525+08:00"><p>3 セントあります</p></del>

作成者は title 属性を使用して、挿入または削除された要素にコメントすることができ、ユーザー エージェント (ブラウザーなど) はこの情報をユーザーに表示できます。

<p><del title="たった今紛失" datetime="20070515T192525+08:00"><div><p>3 セントあります</p></div></del></p>

これは間違った書き方です。つまり、ins と del は、同時にブロックレベル要素とインライン要素の両方になることはできません。

ページ上のinsとdelの表示効果はCSSで制御できます。

<<:  JSにおけるnewの原理と実装について詳しく話しましょう

>>:  MySQL 5.7.33 インストール プロセスの詳細な図解

推薦する

Vue 名前付きスロットの基本的な使用例

序文名前付きスロットは、スロット内の「name」属性を使用して要素にバインドされます。知らせ: 1....

axiosリクエストをvueでカプセル化する方法

実際、Vueでaxiosをカプセル化するのは非常に簡単ですまず、srcパスにhttpフォルダを作成し...

RocketMQ の Docker インストールとインストール中に発生した問題の解決策

目次rocketmqイメージを取得する名前rvを作成する単一のブローカーノードを作成するrocket...

JS 非同期コードユニットテストの魔法 Promise

目次序文プロミスチェーンMDN エラー連鎖デフォルト処理略語非同期待機序文この記事を書いた理由は、ユ...

Angularプロジェクトにおける共有モジュールの実装の詳細な説明

目次1. 共有共通モジュール2. 共有マテリアルモジュール3. 共有確認ダイアログ1. 共有共通モジ...

Linux 構成 SSH パスワードフリーログイン「ssh-keygen」の基本的な使い方

目次1 SSHとは何か2 SSHパスワードフリーログインを設定する2.1 必要なソフトウェアのインス...

ウェブサイト開発におけるフロントエンド開発者とアーティストの知識の違い

概要: 多くの企業、特にインターネット Web サイトを主な事業とする企業のほとんどが、「アーティス...

MySQL binlog ログを開く方法

binlog は、すべての mysql dml 操作を記録するバイナリ ログ ファイルです。 bin...

MYSQL大規模書き込み問題の最適化の詳細な説明

概要: MySQL のパフォーマンス最適化について話すとき、誰もがクエリ パフォーマンスを向上させる...

CSSを使用してTDのINPUTの幅を設定する

最近、C# を使用して Web プログラムを作成していたときに、次のような問題が発生しました。 Te...

MySQL Innodb ストレージ構造と Null 値の保存の詳細な説明

背景:テーブルスペース: すべての INNODB データはテーブルスペース (共有テーブルスペース)...

Vue画像拡大鏡コンポーネントのカプセル化と使用方法の詳細な説明

Vue画像拡大鏡コンポーネントパッケージに基づいて、参考までに具体的な内容は次のとおりです。画像拡大...

JavaScript クリップボードの使用法の詳細な説明

(1)はじめに: clipboard.js は、テキストをクリップボードにコピーする機能を実装する軽...

ウェブデザインの初心者に役立つ学習教材をいくつかお勧めします

勉強中に読んだ本についてもよく聞かれます。以下は初心者におすすめの本です(私が勉強中に読んだ本です。...

Windows での MySQL 8.0.15 の詳細なインストールと使用のチュートリアル

この記事では、MySQL 8.0.15の詳細なインストールと使用方法のチュートリアルを参考までに紹介...