HTML contenteditable Attribute

The HTML contenteditable attribute is used to specify whether or not the content of an element is editable.

You can use this attribute on any HTML element. It is part of the Global Attributes.

The contenteditable attribute accepts true, false, or inherit. An empty string ("") is also valid and behaves identically to true. If the attribute is omitted, the element inherits the value from its parent.

Danger

The contenteditable attribute does not have an effect on disabled elements.

Syntax

Syntax of HTML contenteditable attribute

<tag contenteditable="true|false">&lt;/tag&gt;

Example of the HTML contenteditable attribute:

Example of the HTML "contenteditable" attribute

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p contenteditable="false">
      This is a paragraph. It is not editable.
    </p>
    <p contenteditable="true">
      This is a paragraph. It is editable. Try to change this text.
    </p>
  </body>
</html>

Try it Yourself »

Practice

Which of the following statements are true regarding the HTML contenteditable attribute?

The HTML contenteditable attribute is used to specify whether the content of an element is editable or not.
The HTML contenteditable attribute can only be used with form elements.
When the contenteditable attribute is not set on an element, by default it inherits it from its parent.
The HTML contenteditable attribute has three possible values: 'true', 'false', and 'inherit'.
The HTML contenteditable attribute can only be set to 'true' or 'false'.