contenteditable グローバル属性は、ユーザーによる要素の編集が可能かを示す列挙型属性です。可能である場合、ブラウザーは要素のウィジェットを編集可能なものに変更します。

この属性は、以下の値のうち一つを取る必要があります。

  • true または 空文字列: 要素が編集可能であることを示す
  • false: 要素は編集不可であることを示す

この属性を設定しなかった場合の既定値は、親要素から継承された値です。

この属性は列挙型であり、論理型ではありません。これは値 truefalse または空文字列のいずれかを明示的に使用することが必須であり、 <label contenteditable>Example Label</label> といった省略形は認められないということです。正しい使用法は <label contenteditable="true">Example Label</label> です。

キャレットの挿入文字列を描画するのに使用される色は、 caret-color プロパティで設定できます。

仕様書

Specification Status Comment
HTML Editing APIs
contenteditable の定義
編集者草案 "events", "caret", "typing", "plaintext-only" を追加
HTML Living Standard
contenteditable の定義
現行の標準 最新のスナップショットである HTML 5.2 から変更なし。
HTML 5.2
contenteditable の定義
勧告 HTML Living Standard のスナップショット、 HTML 5.1 から変更なし
HTML 5.1
contenteditable の定義
勧告 HTML Living Standard のスナップショット、 HTML5 から変更なし
HTML5
contenteditable の定義
勧告 HTML Living Standard のスナップショット、初回定義。

ブラウザーの対応

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応 あり あり35.59 あり
contenteditable="events" あり ? なし なし ? ?
contenteditable="caret" あり ? なし なし ? ?
contenteditable="typing" あり ? なし なし ? ?
contenteditable="plaintext-only" あり ? なし なし ? ?
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応 あり あり あり4 あり あり ?
contenteditable="events" あり あり ? なし ? ? ?
contenteditable="caret" あり あり ? なし ? ? ?
contenteditable="typing" あり あり ? なし ? ? ?
contenteditable="plaintext-only" あり あり ? なし ? ? ?

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, yyss
最終更新者: mfuji09,