ホームページ > ウェブフロントエンド > H5 チュートリアル > HTML5 学習ノートの簡潔版 (8): 新しいグローバル属性

HTML5 学習ノートの簡潔版 (8): 新しいグローバル属性

黄舟
リリース: 2017-01-21 17:04:28
オリジナル
1679 人が閲覧しました

contenteditable 属性

いずれかの要素で contenteditable 属性が使用されている場合、その要素は編集可能な領域であることを意味します。ユーザーは要素の内容とアクション タグを変更できます。例:

<p contenteditable="true">这是一段可编辑的段落。请试着编辑该文本。</p>
ログイン後にコピー

この属性には、true、false、空文字の 3 つのオプション値があります。空文字は true を表します。

フレーム ページは、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-* 属性

開発者は、任意の要素に必要なものを定義できます。将来の HTML バージョンとの競合を避けるために、プレフィックス data- が付いている限り、asp.net MVC での jQuery 検証ではこのメソッドが使用されます (例: data-val="true")。

draggable 属性とdropzone 属性

draggable 属性とdropzone 属性は、新しいドラッグ アンド ドロップ API で使用できます。draggable はドラッグ アンド ドロップが許可されるかどうかを示し、dropzone はドラッグ アンド ドロップが許可される領域を表します。

<p draggable="true" dropzone="div1">test</p>
ログイン後にコピー

hidden属性

hidden属性が定義されている要素を表示しません。ただし、タブ切り替えの非表示レイヤーなどのプレゼンテーション層とは異なり、非表示要素はスクリーン リーダーなどのすべてのディスプレイを対象としています。フォームの非表示フィールドに似ています。

role 属性と aria-* 属性

HTML5 では、補助機能の正当な言語として WAI-ARIA が追加されています。

spellcheck属性

Spellcheck属性は、要素のコンテンツに対してスペルチェックを実行するかどうかを指定します。例:

<p contenteditable="true" spellcheck="true">这是可编辑的段落。请试着编辑文本。</p>
ログイン後にコピー

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


関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート