contenteditable属性用法简单介绍

最新推荐文章于 2024-08-09 08:11:56 发布

weixin_34290096

最新推荐文章于 2024-08-09 08:11:56 发布

阅读量955

点赞数

原文链接：https://yq.aliyun.com/articles/561332

版权

本章节通过代码实例简单介绍一下contenteditable属性的用法。

之前，只有input和textarea的内容才是可以编辑的，但是此属性的出现，让更多元素的内容可以进行编辑。

代码实例如下:

 
       <!DOCTYPE html>< 
       html 
       > 
      
 
       < 
       head 
       > 
      
 
       < 
       meta 
       charset 
       = 
       " utf-8" 
       > 
      
 
       < 
       meta 
       name 
       = 
       "author" 
       content 
       = 
       "http://www.softwhy.com/" 
       /> 
      
 
       < 
       title 
       >蚂蚁部落</ 
       title 
       > 
      
 
       < 
       style 
       type 
       = 
       "text/css" 
       > 
      
 
       div{ 
      
 
          
       width:200px; 
      
 
          
       height:150px; 
      
 
          
       border:1px solid black; 
      
 
       } 
      
 
       </ 
       style 
       > 
      
 
       </ 
       head 
       > 
      
 
       < 
       body 
       > 
      
 
       < 
       div 
       contenteditable 
       = 
       "true" 
       >蚂蚁部落欢迎您</ 
       div 
       > 
      
 
       </ 
       body 
       > 
      
 
       </ 
       html 
       > 
      