contenteditable属性

不论什么元素使用contenteditable属性的话,代表该元素是一个可编辑的区域。

用户能够改变元素的内容以及操作标记。比如:

<p contenteditable="true">这是一段可编辑的段落。请试着编辑该文本。</p>

该属于有3种值可选:true, false和空字符,空字符代表true。

而对<iframe id="editor"></iframe>框架页面能够通过JS程序代码来实现:editor.document.designMode="on" 。

contextmenu属性

contextmenu属性用来指向一个作者提供的上下文文件夹,比如:

<form name="npc" action="">
<label>Character name: <input type=text contextmenu=namemenu required></label>
<menu type=context id=namemenu>
<command label="Pick random name" onclick="document.forms.npc.elements.char.value = getRandomName()">
<command label="Prefill other fields based on name" onclick="prefillFields(document.forms.npc.elements.char.value)">
</menu>
</form>

data-*属性

开发者能够在不论什么元素上定义他们想要的不论什么属性,仅仅要他们在其之前加上 data- 的前缀,以此避免与未来的HTML版本号的冲突。asp.net MVC下的jQuery验证就是採用这样的方式。比如:data-val=”true”。

draggable和dropzone属性

draggable 和 dropzone 属性能够与新的拖放API一起使用。draggable为是否同意拖放,dropzone代表能够拖放到哪个区域。

<p draggable="true" dropzone="div1">test</p>

hidden属性

不显示定义了hidden属性的元素。但与表现层的比方tab切换隐藏图层不同。hidden后的元素针对全部的显示,比方屏幕阅读器。与form里的hidden域相似。

role和aria-*属性

HTML5把WAI-ARIA当作是合法的语言添加,用来做辅助作用。

spellcheck属性

spellcheck 属性规定是否对元素内容进行拼写检查。

比如:

<p contenteditable="true" spellcheck="true">这是可编辑的段落。请试着编辑文本。</p>

HTML5学习笔记简明版(8):新增的全局属性的更多相关文章

  1. [html5] 学习笔记-表单新增元素与属性

    本节讲的是表单元素的form,formaction属性,frommethod,formenctype属性,formtarget,autofocus属性,required,labels属性. 1.for ...

  2. [html5] 学习笔记-表单新增的元素与属性(续)

    本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indetermi ...

  3. HTML5学习笔记简明版(11):新增的API

    HTMLDocument上的扩展 HTML5在DOM Level 2 HTML上扩展了一些HTMLDocument的接口.这些接口在全部实现了Document接口的元素对象上进行了实现. HTML5在 ...

  4. HTML5学习笔记一:新增主体结构元素

    Dreamweaver快捷键: 属性面板:Ctrl+F3 新建文档:Ctrl+N 选择用网页查看:F12 新增的主体结构元素: section元素(例子如下): <!DOCTYPE HTML&g ...

  5. HTML5学习笔记简明版(5):input的type超级类型

    HTML5为input的type类型添加了多种枚举值,用来表达不同的意思.同事具有验证功能,假设格式不正确,浏览器将原始提供错误提示,堪称超级牛X啊,详细例如以下: Keyword Data type ...

  6. HTML5学习笔记简明版(9):变化的元素和属性

    改变的元素(Element) 下面元素在HTML5里的使用方法稍作改动以便能在web里更好的使用或者起到更大作用: 没有href属性的a元素将显示成一个占位符,并且a元素内部如今支持flow cont ...

  7. HTML5学习笔记简明版(1):HTML5介绍与语法

    HTML5介绍 HTML5是继HTML4以后的下一代HTML标准规范,它提供了一些新的元素和属性(例如<nav>网站导航块和<footer>).新型的标签有利于搜索引擎和语义分 ...

  8. HTML5学习笔记简明版(11):新API

    HTMLDocument上的扩展 HTML5在DOM Level 2 HTML上扩展了一些HTMLDocument的接口. 这些接口在全部实现了Document接口的元素对象上进行了实现.HTML5在 ...

  9. HTML5学习笔记简明版(10):过时的元素和属性

    被遗弃的元素(Element) 这个小节里列出的元素在HTML5里将不再使用,现有文档升级到 HTML5的话能够使用一些替代方案.比如parser section 能够处理isindex 元素的功能. ...

随机推荐

  1. docker 要点学习

    本文主要记录学习和使用docker时遇到的一些问题和踩过的坑 1.本地docker新建redis容器,映射6379端口到本地,本机的java项目再去连,会一直连不上,原因是redis容器中映射端口时需 ...

  2. 洛谷P3383线性筛素数

    传送门 代码中体现在那个 $ break $ $ prime $ 数组 中的素数是递增的,当 $ i $ 能整除 $ prime[j ] $ ,那么 $ iprime[j+1] $ 这个合数肯定被 $ ...

  3. Python外部脚本调用Django项目Model表

    在实际生产中有时候会出现这种情况,原本运行了一个Django项目,后面又需要一些外部脚本进行辅助,而这些脚本又不希望集成到项目当中,但是又需要用到Django项目的Model,这时候是无法像在项目当中 ...

  4. 【OpenCV for Android】Android Studio集成OpenCV

    准备工作 1.下载安装Android Studio(过程略). 2.下载Android OpenCV:https://opencv.org/releases.html,找到Android pack点击 ...

  5. .NetCore下使用Prometheus实现系统监控和警报 (三)集成Grafana

    有了前面InfluxDB的经验,这里就很好处理了,数据类型选择Prometheus选地址等,填好保存 同样通过导入数据处理,我们在https://grafana.com/dashboards上选择Da ...

  6. 【转载】Java与C++语言在作用域上的差异浅析

    http://developer.51cto.com/art/200906/126199.htm 差异一:变量作用域的不同 如下面这段程序代码是符合C++语言的语法要求的.其可以在C语言下正常运行.但 ...

  7. Angular快速学习笔记(2) -- 架构

    0. angular 与angular js angular 1.0 google改名为Angular js 新版本的,2.0以上的,继续叫angular,但是除了名字还叫angular,已经是一个全 ...

  8. 【LOJ】#2496. 「AHOI / HNOI2018」毒瘤

    题面 还有这么诚实的出题人! 我们最多影响20个点,然后把这20个点的虚树建出来,并且枚举每个点的选举状态,如果一个点选或不选可以通过改\(dp[u][0] = 0\)或\(dp[u][1] = 0\ ...

  9. gdb 调试及优化

    调试程序时,在gdb内p var,会提示 No symbol "var" in current context. 即使没有使用任何编译优化选项,仍然不能查看,可能是这些变量被优化到 ...

  10. 在vi 按了Ctrl s 之后..

    习惯了在windows下写程序,也习惯了按ctrl+s 保存代码,在用vi的时候,也习惯性的按了ctrl+s 然后vi终端就像卡住了一样. 原来: ctrl+s 终止屏幕输出(即停止回显),你敲的依然 ...