HTML contenteditable Attribute

HTML contenteditable Attribute: This attribute defines whether the content of an element is editable or not. If this attribute is not set in the element, then it will inherit from its parent element. The contenteditable attribute has not been defined in HTML4. It was newly added in HTML5.

HTML contenteditable Attribute

This attribute has the element applies to all HTML elements. This attribute contains two values i.e. true (or) false. if the attribute value is true then the content is editable whereas the value is false then the content is not editable.

Syntax: <element contenteditable = “true|false”>



Attribute

It is mainly an instance of a Global Attributes and it can be used in any HTML elements. This attribute contains two value either true or false. If the attribute value is true then the content is editable and if the attribute value is false the content is not editable.

Browser Support

The  attribute is supported by the following browsers:

  • Chrome – 4.0
  • Firefox – 3.5
  • Safari – 3.1
  • Opera – 10.0
  • Internet Explorer – 6.0

Example: for contenteditable attribute

<!DOCTYPE html> 
<html> 
 <head> 
   <title>contenteditable attribute</title> 
  <style> 
     body { 
	width:60%; 
	text-align:center; 
      } 
     h1 { 
	color:green; 
       } 
   </style> 
  </head> 
    <body> 
	<h1>Freshersnow</h1> 
	<h2>contenteditable attribute</h2> 
	<p contenteditable="true">Freshersnow: A computer science portal for freshers</p> 
    </body> 
</html>					 

Output:

HTML contenteditable attribute