Rumah hujung hadapan web Tutorial H5 HTML5学习笔记简明版(8):新增的全局属性

HTML5学习笔记简明版(8):新增的全局属性

Jan 21, 2017 pm 05:04 PM

contenteditable属性

任何元素使用contenteditable属性的话,代表该元素是一个可编辑的区域。用户可以改变元素的内容以及操作标记。例如:

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

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

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

contextmenu属性

contextmenu属性用来指向一个作者提供的上下文目录,例如:

&lt;form name=&quot;npc&quot; action=&quot;&quot;&gt;
 &lt;label&gt;Character name: &lt;input type=text contextmenu=namemenu  required&gt;&lt;/label&gt;
 &lt;menu type=context id=namemenu&gt;
  &lt;command label=&quot;Pick random name&quot; onclick=&quot;document.forms.npc.elements.char.value = getRandomName()&quot;&gt;
  &lt;command label=&quot;Prefill other fields based on name&quot; onclick=&quot;prefillFields(document.forms.npc.elements.char.value)&quot;&gt;
 &lt;/menu&gt;
&lt;/form&gt;
Salin selepas log masuk

data-*属性

开发人员可以在任何元素上定义他们想要的任何属性,只要他们在其之前加上 data- 的前缀,以此避免与未来的HTML版本的冲突,asp.net MVC下的jQuery验证就是采用这种方式,例如:data-val=”true”。

draggable和dropzone属性

draggable 和 dropzone 属性可以与新的拖放API一起使用,draggable为是否允许拖放,dropzone代表可以拖放到哪个区域。

&lt;p draggable=&quot;true&quot; dropzone=&quot;div1&quot;&gt;test&lt;/p&gt;
Salin selepas log masuk

hidden属性

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

role和aria-*属性

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

spellcheck属性

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

&lt;p contenteditable=&quot;true&quot; spellcheck=&quot;true&quot;&gt;这是可编辑的段落。请试着编辑文本。&lt;/p&gt;
Salin selepas log masuk

以上就是HTML5学习笔记简明版(8):新增的全局属性的内容,更多相关内容请关注PHP中文网(www.php.cn)!


Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Tag artikel panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Jadual Bersarang dalam HTML Jadual Bersarang dalam HTML Sep 04, 2024 pm 04:49 PM

Jadual Bersarang dalam HTML

Sempadan Jadual dalam HTML Sempadan Jadual dalam HTML Sep 04, 2024 pm 04:49 PM

Sempadan Jadual dalam HTML

HTML jidar-kiri HTML jidar-kiri Sep 04, 2024 pm 04:48 PM

HTML jidar-kiri

Susun Atur Jadual HTML Susun Atur Jadual HTML Sep 04, 2024 pm 04:54 PM

Susun Atur Jadual HTML

Memindahkan Teks dalam HTML Memindahkan Teks dalam HTML Sep 04, 2024 pm 04:45 PM

Memindahkan Teks dalam HTML

Senarai Tertib HTML Senarai Tertib HTML Sep 04, 2024 pm 04:43 PM

Senarai Tertib HTML

Butang onclick HTML Butang onclick HTML Sep 04, 2024 pm 04:49 PM

Butang onclick HTML

Pemegang Tempat Input HTML Pemegang Tempat Input HTML Sep 04, 2024 pm 04:54 PM

Pemegang Tempat Input HTML

See all articles