【content editable属性】要素内の編集の可否を指定する。「HTML・属性」- ノブレコ
nobreco
content edetable属性とは
この属性を指定した場合、その要素の編集の可否を指定します。
編集をするか否かは、指定する値で決めることができます。
【仕様】
★属性の区分
グローバル属性
★対応ブラウザ
・Chrome
・Firefox
・Internet Explorer
・Opera
・Safari
【使用目的】
content editable属性は、指定した要素の内容を編集するか否かを決めるために使う属性です。
情報の中身を編集すると考えれば分かりやすいかもしれません。
編集するかどうかを決める値は以下の通りになります。
【属性値と効果】
| 属性値 | 効果 |
| true | 編集を可能にします。 |
| false | 編集を不可にします。 |
| 空文字列 | 親要素の編集可否を継承します。 |
【指定できる要素】
content editable属性はグローバル属性のため、全てのHTML要素に指定することができます。
ですが、指定したHTML要素との組み合わせ次第では、属性の効果が発揮されないことがあるので注意してください。
★旧HTMLからの変更点
HTML5：content editable属性が定義されました。
HTML LS：値にplaintext-onlyが付け加えられました。
実用例
■content editable属性の使用例
★content editable属性の記述例
★表示結果
contenteditable属性に対応しているブラウザであれば、このテキストは編集することができます。
まとめ
この記事では、content editable属性の解説をいたしました。
この属性は、指定した要素に対して、その内容を編集可能にするか否かを決める効果を持っている属性です。
対応しているブラウザでは、直接ユーザーがテキストなどを編集できるようになります。
この属性を使う際は、本当に必要かどうかをよく考えてから使用することをオススメします。
この記事が少しでも皆さんのお役に立てれば幸いです。
最後まで読んでいただき、ありがとうございました。またなん💡
