From b76d47d75c13eb067cfb11b535677c3bd0a23b16 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sat, 1 May 2021 01:26:03 +0900 Subject: 20210418-Web/HTML/Element/menu (#559) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 2021/03/27 時点の英語版に同期 --- files/ja/web/html/element/menu/index.html | 96 +++++++++++++++++-------------- 1 file changed, 54 insertions(+), 42 deletions(-) (limited to 'files/ja/web/html') diff --git a/files/ja/web/html/element/menu/index.html b/files/ja/web/html/element/menu/index.html index 815207ede2..9a12563561 100644 --- a/files/ja/web/html/element/menu/index.html +++ b/files/ja/web/html/element/menu/index.html @@ -2,37 +2,47 @@ title: slug: Web/HTML/Element/menu tags: + - Element + - Experimental - HTML - - HTML 対話型コンテンツ - - 'HTML:フローコンテンツ' - - 'HTML:知覚可能コンテンツ' + - HTML interactive elements + - Navigation - Reference + - Site Navigation + - UI + - UX + - User Interface + - User experience - Web - - ウェブ + - menu + - menus + - HTML 対話型コンテンツ + - HTML:フローコンテンツ + - HTML:知覚可能コンテンツ - サイトナビゲーション - メニュー - ユーザーインターフェイス - 要素 translation_of: Web/HTML/Element/menu --- -
{{HTMLRef}}{{SeeCompatTable}}
+

{{HTMLRef}}{{SeeCompatTable}}

-

HTML の <menu> 要素は、ユーザーが実行またはアクティブ化可能なコマンドのグループを表します。これはスクリーンの上部にあるリストメニューや、ボタンを押したときにボタンの下部に現れるようなコンテキストメニューを含みます。

+

HTML の <menu> 要素は、ユーザーが実行またはアクティブ化できるコマンドのグループを表します。これは画面の上部に現れるリストメニューと、ボタンを押したときにその下部付近に現れるようなコンテキストメニューの両方を含みます。

- + @@ -41,11 +51,15 @@ translation_of: Web/HTML/Element/menu - + + + + + - + @@ -54,37 +68,37 @@ translation_of: Web/HTML/Element/menu
コンテンツカテゴリコンテンツカテゴリー -

フローコンテンツ。要素の子が1個以上の {{HTMLElement("li")}} 要素を含んでいる場合は知覚可能コンテンツ。

+

フローコンテンツ。この要素の子に 1 個以上の {{HTMLElement("li")}} 要素がある場合は知覚可能コンテンツ。
許可されている内容 -

要素がリストメニュー状態である場合: フローコンテンツまたは0個以上の {{HTMLElement("li")}}, {{HTMLElement("script")}}, {{HTMLElement("template")}}。 (リストメニューは、親要素がコンテキストメニュー状態の {{HTMLElement("menu")}} でない場合の既定の状態です。)

+

要素がリストメニュー状態である場合: フローコンテンツまたは 0 個以上の {{HTMLElement("li")}}, {{HTMLElement("script")}}, {{HTMLElement("template")}}。 (リストメニューは、親要素がコンテキストメニュー状態の {{HTMLElement("menu")}} でない場合の既定の状態です。)

-

要素がコンテキストメニュー状態である場合は、任意の順序で、0個以上の {{HTMLElement("menu")}} (コンテキストメニュー状態に限る), {{HTMLElement("menuitem")}}, {{HTMLElement("hr")}}, {{HTMLElement("script")}}, {{HTMLElement("template")}}。

+

要素がコンテキストメニュー状態である場合: 任意の順序で、 0 個以上の {{HTMLElement("menu")}} (コンテキストメニュー状態に限る), {{HTMLElement("menuitem")}}, {{HTMLElement("hr")}}, {{HTMLElement("script")}}, {{HTMLElement("template")}}。
許可されている親要素フローコンテンツを受け入れるすべての要素フローコンテンツを受け入れるすべての要素
暗黙の ARIA ロールlist
許可されている ARIA ロールなし{{ARIARole("directory")}}, {{ARIARole("group")}}, listbox, {{ARIARole("menu")}}, {{ARIARole("menubar")}}, {{ARIARole("none")}}, {{ARIARole("presentation")}}, {{ARIARole("radiogroup")}}, {{ARIARole("tablist")}}, {{ARIARole("toolbar")}}, {{ARIARole("tree")}}
DOM インターフェイス
-

属性

+

属性

-

この要素にはグローバル属性があります。

+

この要素にはグローバル属性があります。

{{HTMLAttrDef("label")}} {{Deprecated_inline}}
-
ユーザーに対して表示する、メニューの名称です。入れ子のメニューで、サブメニューへアクセスできるようにするためにラベルを与えます。親要素がコンテキストメニュー状態の {{HTMLElement("menu")}} である場合に限り、必須です。
+
ユーザーに対して表示されるメニューの名称です。入れ子のメニューの中で、サブメニューへアクセスするためのラベルを提供するために使用されます。親要素が {{HTMLElement("menu")}} でコンテキストメニュー状態である場合に限り、指定する必要があります。
{{HTMLAttrDef("type")}}
-
この属性は定義済みのメニューの種類を示すものであり、以下2つの値のいずれかを指定します。 +
この属性は定義済みのメニューの種類を示すものであり、以下 2 つの値のいずれかを指定します。
    -
  • context {{Deprecated_inline}} : ポップアップメニュー状態であり、他の要素を経由してアクティブになるコマンドのグループを表します。 {{HTMLElement("button")}} 要素の {{HTMLAttrxRef("menu", "button")}} 属性や、 contextmenu 属性を持つ要素を経由することが考えられます。 <menu> 要素が別の menu 要素の入れ子になっているとき、親要素がすでにこの状態であれば、子要素で値が指定されていない場合の既定値になります。
    • -
  • toolbar: ツールバー状態であり、ユーザーと対話するための一連のコマンドを表します。これは {{HTMLElement("li")}} が並んだ番号なしリストの形か、子要素に <li> を含まない場合は、利用できるコマンドを記述したフローコンテンツです。属性が指定されていない場合の既定値です。
    • +
  • context {{Deprecated_inline}} : 他の要素を介して起動されるコマンドのグループを表すポップアップメニュー状態を表します。これは {{HTMLElement("button")}} 要素の {{HTMLAttrxRef("menu", "button")}} 属性で参照されるボタンメニューや、 contextmenu 属性のある要素のコンテキストメニューである可能性があります。この値はこの属性がなく、その親要素も <menu> であった場合の既定値です。
    • +
  • toolbar: ツールバー状態であり、ユーザーと対話するための一連のコマンドから成るツールバーを表します。これは {{HTMLElement("li")}} の番号なしリストの形か、子要素に <li> を含まない場合は、利用できるコマンドを記述したフローコンテンツです。この値はこの属性が指定されていない場合の既定値です。
-

使用上の注意

+

使用上の注意

-

{{HTMLElement("menu")}} 要素と {{HTMLElement("ul")}} 要素はともに順序なしリストの項目を表すものですが、 {{HTMLElement("ul")}} は主に項目の表示を目的とするのに対し、 {{HTMLElement("menu")}} 要素は操作を行うための対話型の項目を含めるためのものです。

+

{{HTMLElement("menu")}} 要素と {{HTMLElement("ul")}} 要素はともに順序なしリストの項目を表すものです。主な違いは、 {{HTMLElement("ul")}} は主に項目の表示を目的とするのに対し、 {{HTMLElement("menu")}} 要素は操作を行うための対話型の項目のためのものです。

-

HTML メニューは、コンテキストメニュー（一般的に、別の要素を右クリックすると表示される）またはツールバーを作成するために使用できます。

+

HTML メニューは、コンテキストメニュー (一般的に、別の要素を右クリックすると表示される) またはツールバーを作成するために使用することができます。

-

{{anch("Context menu", "コンテキストメニュー")}}は、「メニューで選択可能な項目を表す {{HTMLElement("menuitem")}} 要素」「メニュー内のサブメニューを表す <menu> 要素」「メニューの内容をセクションに分けるセパレーター行を表す {{HTMLElement("hr")}} 要素」を包含する <menu> 要素で構成されます。. コンテキストメニューは、関連付ける要素の {{HTMLAttrxRef("contextmenu")}} 属性、または {{anch("Button menu", "ボタンでアクティブにするメニュー")}} であれば {{HTMLElement("button")}} 要素の {{HTMLAttrxRef("menu", "button")}} 属性を使用して、メニューをアクティブ化する要素に紐づけます。

+

{{anch("Context menu", "コンテキストメニュー")}}は、 <menu> 要素の中にメニューで選択可能な項目を表す {{HTMLElement("menuitem")}} 要素、メニュー内のサブメニューを表す <menu> 要素、メニューの内容をセクションに分けるセパレーター行を表す {{HTMLElement("hr")}} 要素が含まれたもので構成されます。 コンテキストメニューは、関連付ける要素の {{HTMLAttrxRef("contextmenu")}} 属性、または{{anch("Button menu", "ボタンでアクティブにするメニュー")}}であれば {{HTMLElement("button")}} 要素の {{HTMLAttrxRef("menu", "button")}} 属性を使用して、メニューをアクティブ化する要素に紐づけます。

-

{{anch("Toolbar", "ツールバーメニュー")}} は、以下のいずれかをコンテンツにした <menu> 要素で構成されます: {{HTMLElement("li")}} 要素で表した項目の順不同リスト (それぞれの項目が、ユーザーが利用できるコマンドやオプションを表します)。または、(<li> 要素がない場合) 使用なコマンドやオプションを表す フローコンテンツ。

+

{{anch("Toolbar", "ツールバーメニュー")}} は、 <menu> 要素の中身が 2 通りのうちの一方で記述されたもので構成されます。 {{HTMLElement("li")}} 要素で表した項目の順不同リスト (それぞれの項目が、ユーザーが利用できるコマンドやオプションを表す) または、 (<li> 要素がない場合) 使用なコマンドやオプションを表すフローコンテンツのどちらかです。

-

この要素は HTML4 で非推奨になりましたが、 HTML5.1 および HTML living standard で再導入されました。本ドキュメントは、現行の Firefox の実装について説明します。 HTML 5.1 によって、type 属性の 'list' が 'toolbar' に変わりました。

+

この要素は HTML4 で非推奨になりましたが、 HTML5.1 および HTML living standard で再導入されました。本ドキュメントは、現行の Firefox の実装について説明します。 HTML 5.1 によれば、 type 属性の 'list' が 'toolbar' に変わったようです。

-

例

+

例

-

コンテキストメニュー

+

コンテキストメニュー

{{Deprecated_header}}

@@ -112,17 +126,17 @@ translation_of: Web/HTML/Element/menu } -

結果

+

結果

{{EmbedLiveSample("Context_menu", "100%", 80)}}

- + -
-

メニューボタンを実装しているブラウザーはまだありません。 <menu> 要素の {{HTMLAttrxRef("type", "menu")}} 属性は廃止されました。

+
+

メニューボタンを実装しているブラウザーはまだ知られていません。 <menu> 要素の {{HTMLAttrxRef("type", "menu")}} 属性は廃止されました。

-
+

{{HTMLElement("menuitem")}} 要素は廃止されました。

@@ -141,14 +155,14 @@ translation_of: Web/HTML/Element/menu </menu> -

結果

+

結果

{{EmbedLiveSample("Menu_button", "100%", 50)}}

-

ツールバー

+

ツールバー

-
-

ツールバーメニューを実装しているブラウザーはまだありません。

+
+

ツールバーメニューを実装しているブラウザーはまだ知られていません。

HTML

@@ -174,11 +188,11 @@ translation_of: Web/HTML/Element/menu </menu> -

結果

+

結果

{{EmbedLiveSample("Toolbar", "100%", 100)}}

-

仕様書

+

仕様書

@@ -192,7 +206,7 @@ translation_of: Web/HTML/Element/menu - + @@ -202,13 +216,11 @@ translation_of: Web/HTML/Element/menu
{{SpecName("HTML WHATWG", "grouping-content.html#the-menu-element", "<menu>")}} {{Spec2("HTML WHATWG")}}最新のスナップショット {{SpecName("HTML5.3")}} から変更なし最新のスナップショット {{SpecName("HTML5.2")}} から変更なし
{{SpecName("HTML5.1", "interactive-elements.html#the-menu-element", "<menu>")}}
-

ブラウザーの互換性

- - +

ブラウザーの互換性

{{Compat("html.elements.menu")}}

-

関連情報

+

関連情報

  • 他のリスト関連 HTML 要素: {{HTMLElement("ol")}}, {{HTMLElement("ul")}}, {{HTMLElement("li")}}, {{HTMLElement("hr")}} および廃止済の {{HTMLElement("dir")}}
    • -- cgit v1.2.3-54-g00ecf