Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
HTML contenteditable Attribute
The contenteditable attribute in HTML is used to set whether the content is editable or not using boolean values true or false. This attribute can be used with any element since it is a Global Attribute.
Following is the syntax −
<element contenteditable =”true|false”>
Above, set true if you want the element to be editable, else false.
Let us now see an example to implement the contenteditable attribute in HTML −
Example
<!DOCTYPE html> <html> <body> <h2 contenteditable="true">Demo Heading</h2> <p contenteditable="true">This is a demo line.</p> </body> </html>
Output
This will produce the following output. Displaying the heading and p elements are now editable −
Now, we can edit the heading and content. Therefore, let us change the heading and display the screenshot −
In the above example, we have set a heading and some text −
<h2 contenteditable="true">Demo Heading</h2> <p contenteditable="true">This is a demo line.</p>
We have made the heading and the content as editable using the contenteditable property. On setting it true, you will be able to edit it on the web page itself −
h2 contenteditable="true"
4K+ Views
