1.contenteditable 属性指定元素内容是否可编辑。

注意： 当元素中没有设置 contenteditable 属性时，元素将从父元素继承。

所有主流浏览器都支持 contenteditable 属性

语法

<element contenteditable="true|false">
<!DOCTYPE html>

<html>

<body>

<p contenteditable="true">这是一个段落。是可编辑的。尝试修改文本。</p>

</body>

</html>

　2.draggable 属性规定元素是否可拖动。

提示： 链接和图像默认是可拖动的。

提示： draggable 属性经常用于拖放操作。

语法

<element draggable="true|false|auto">
true 规定元素是可拖动的。
false 规定元素是不可拖动的。
auto 使用浏览器的默认特性。 
<!DOCTYPE HTML>

<html>

<head>

<style type="text/css">

#div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;}

</style>

<script type="text/javascript">

function allowDrop(ev){

　　ev.preventDefault();

}

function drag(ev){

　　ev.dataTransfer.setData("Text",ev.target.id);

}

function drop(ev){

　　var data=ev.dataTransfer.getData("Text");

　　ev.target.appendChild(document.getElementById(data));

　　ev.preventDefault();

}

</script>

</head>

<body>

<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

<br />

<p id="drag1" draggable="true" ondragstart="drag(event)">这是一段可移动的段落。请把该段落拖入上面的矩形。</p>

</body>

</html>

　　

HTML5新属性的更多相关文章

  1. HTML5新属性在Google浏览器中不能显示的问题

    这两天在学习HTML5新属性时遇到了如下问题,很是不解: 例如在学习使用canvas时,需要绘制一个红色的原点,代码如下: <!DOCTYPE HTML> <html> < ...

  2. （二）给IE6-IE9中的input添加HTML5新属性-placeholder

    同样是最近遇到的一个小问题.因为IE9以下input是不支持placeholder属性的.在网上找到了解决方案,果断带走.正如鲁迅先生所说的‘拿来主义’:运用脑髓,放出眼光,自己来拿!感谢.借花献佛在 ...

  3. 【HTML】html5新属性-datalist

    摘要: 为实现输入域自动填充的效果 方法一: jquery-ui的autocomplete方法, 不是jquery 自带的方法. 方法二: 采用html5新特性,datalist,例子如下:坏处很明显 ...

  4. HTML5新属性-----拖放

    最早引入JS拖放功能的是IE4,当时,网页中只有两种对象可以拖放:图像和某些文本.拖动图像时,把鼠标放在图像上,按住鼠标不放就可以拖动它.拖动文本时,需要选中文本,然后可以像拖动图像一样拖动被选中的文 ...

  5. HTML5 新属性的讲解

    1.选择器: 标签选择器: class选择器: id选择器: 后代选择器:div li div下所有li 子代选择器:div>li div的所有子一代 li 元素 交集选择器:div.class ...

  6. html5 新属性

    <p contenteditable="true">这是一段可编辑的段落.请试着编辑该文本.</p> <input id="email&qu ...

  7. html5新属性contenteditable 对于那些不可编辑的标签，现在都可以编辑了

    contenteditable = true 表示该html标签的内容可以编辑,对于那些不可编辑的标签,现在都可以编辑了.

  8. sad 关于一些html5新属性还需要用https才能支持

    像我昨天在搞一个录音的小东西 在本地正常录音正常播放 但是放到线上环境http环境上就出现了如上的错误 功能都不能正常使用 然后就改成https线上环境  然后就正常了 如上 大家有什么赐教的欢迎留言 ...

  9. HTML5新的标签和属性

    <article>标签定义外部的内容.比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本.亦或是来自其他外部源内容. HTML5:<arti ...

随机推荐

  1. [转载]Matlab中fft与fftshift命令的小结与分析

    http://blog.sina.com.cn/s/blog_68f3a4510100qvp1.html 注:转载请注明出处——by author. 我们知道Fourier分析是信号处理里很重要的技术 ...

  2. C# 限制Text只能输入数字

    private void InputNumber(KeyPressEventArgs e) { //如果输入的不是数字键,也不是回车键.Backspace键,则取消该输入 && e.K ...

  3. discuz二次开发笔记（三）------discuz的安装步骤

    下载好discuz的安装包后,解压在自己定义的文件夹里面,将upload里面的文件拷贝出来放到和upload同级的地方,然后删除upload文件夹. 打开浏览器,输入你文件夹的地址:如:http:// ...

  4. Android应用截图嵌入到真实设备

    Device Art Generator 你可以使用 Device Art Generator 方便快捷地将应用截图嵌入到真实设备的效果图中.这样,当用户在你的网站上或其他宣传材料中看到你的应用截图时 ...

  5. shopnc 导出Excel数据问题实例 && ajax 获取当前值并传递

    任务:从商家中心导出数据,各个商品所属情况. 商品导出到Excel文件功能 /导出exel 功能make-in-lemon public function createExcelOp(){ $mode ...

  6. FMDB将对象放进数据库［二］（使用runtime）

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  7. C函数指针简单用例

    (1)函数指针:可以指向 一类 固定形参类型和返回值类型 的函数 的指针声明:int fun(int, int)    ||    \/int (*pfun)(int, int) pfun就是函数指针 ...

  8. 【测试技术】ant中的for循环用法

    有的时候,我们希望ant中也能类似脚本语言一样进行for循环,以实现一些重复性工作.由于ant核心包并未提供此功能,所以需要下载一个扩展包扔到ant的lib目录下去.详细步骤如下: 1.下载核心包:a ...

  9. oracle表空间使用率统计查询

    今天发现有一张采样表从1月5号开始不记录数据了,所以想查看一下表空间使用率,在网上零零散散找了很多资料,现在记录如下,也不知道哪一个最准确.还有一个就是网上拷贝的sql代码格式太乱了,不好看,找到一个 ...

  10. 关于SubclassWindow()和SubclassDlgItem

    msdn上的解析 CWnd::SubclassWindowBOOL SubclassWindow( HWND hWnd ); Return Value Nonzero if the function ...