From 0a2d156a8938fc2b38b9828acb07df2a8d22b7d2 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sat, 1 May 2021 01:23:57 +0900 Subject: Web/HTML/Element/figure を更新 (#554) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 2021/03/27 の英語版に同期 --- files/ja/web/html/element/figure/index.html | 52 ++++++++++++++++------------- 1 file changed, 28 insertions(+), 24 deletions(-) (limited to 'files/ja/web/html/element/figure') diff --git a/files/ja/web/html/element/figure/index.html b/files/ja/web/html/element/figure/index.html index 2eb475494e..e80d5c48dd 100644 --- a/files/ja/web/html/element/figure/index.html +++ b/files/ja/web/html/element/figure/index.html @@ -1,19 +1,19 @@ --- -title: '
: 任意のキャプション付きの図要素' +title: '
: キャプションが付けられる図要素' slug: Web/HTML/Element/figure tags: + - Element - HTML - - HTML コンテンツグループ化 - - 'HTML:フローコンテンツ' - - 'HTML:区分化ルート' - - 'HTML:知覚可能コンテンツ' + - HTML grouping content + - Information + - Presentation - Reference - - 要素 + - figure translation_of: Web/HTML/Element/figure ---
{{HTMLRef}}
-

HTML の <figure> (任意のキャプション付きの図) 要素は、図表などの自己完結型のコンテンツを表し、任意で ({{HTMLElement("figcaption")}}) 要素を使用して表されるキャプションを伴います。図、すなわちキャプションとその中身は一つの単位として参照されます。

+

HTML の <figure> (キャプションが付けられる図) 要素は、図表などの自己完結型のコンテンツを表し、任意で {{HTMLElement("figcaption")}} 要素を使用して表されるキャプションを付けることができます。図、すなわちキャプションとその中身は一つの単位として参照されます。

{{EmbedInteractiveExample("pages/tabbed/figure.html","tabbed-shorter")}}
@@ -22,12 +22,12 @@ translation_of: Web/HTML/Element/figure - - + + - + @@ -35,11 +35,15 @@ translation_of: Web/HTML/Element/figure - + + + + + - + @@ -48,21 +52,21 @@ translation_of: Web/HTML/Element/figure
コンテンツカテゴリフローコンテンツ, 区分化ルート, 知覚可能コンテンツコンテンツカテゴリフローコンテンツ, 区分化ルート, 知覚可能コンテンツ
許可されている内容{{HTMLElement("figcaption")}} 要素とそれに続くフローコンテンツ、またはフローコンテンツとそれに続く{{HTMLElement("figcaption")}} 要素、またはフローコンテンツ{{HTMLElement("figcaption")}} 要素とそれに続くフローコンテンツ、またはフローコンテンツとそれに続く {{HTMLElement("figcaption")}} 要素、またはフローコンテンツ
タグの省略
許可されている親要素フローコンテンツを受け入れるすべての要素フローコンテンツを受け入れるすべての要素
暗黙の ARIA ロールfigure
許可されている ARIA ロール{{ARIARole("group")}}, {{ARIARole("presentation")}}子孫に figcaption がない場合: any、それ以外の場合は許可されているロールなし
DOM インターフェイス
-

属性

+

属性

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

-

使用上のメモ

+

使用上のメモ

  • ふつう <figure> は画像、イラスト、グラフ、コードの断片など、文書の本文の流れから参照されるものの、本文の流れに影響を与えることなく、文書のほかの部分や付録に移動することが可能なものに用います。
    • -
  • 区分化ルートとなり、 <figure> 要素のコンテンツのアウトラインは、文書の本文のアウトラインから除外されます。
    • +
  • 区分化ルートとなり、 <figure> 要素のコンテンツのアウトラインは、文書の本文のアウトラインから除外されます。
  • キャプションは <figure> 要素の中に (最初または最後の子要素として) {{HTMLElement("figcaption")}} 要素を挿入することで表すことができます。図の中で最初に見つかった最初の <figcaption> 要素が図のキャプションとして表示されます。
-

例

+

例

-

画像

+

画像

<!-- 単なる画像 -->
 <figure>
@@ -82,7 +86,7 @@ translation_of: Web/HTML/Element/figure
 
 
{{EmbedLiveSample("Images", "100%", 375)}}

 
-
コードスニペット

+
コードスニペット

 
 
<figure>
   <figcaption>Get browser details using <code>navigator</code>.</figcaption>
@@ -102,7 +106,7 @@ function NavigatorExample() {
 
 
{{EmbedLiveSample("Code_snippets", "100%", 250)}}

 
-
引用

+
引用

 
 
<figure>
   <figcaption><cite>Edsger Dijkstra:</cite></figcaption>
@@ -113,7 +117,7 @@ function NavigatorExample() {
 
 
{{EmbedLiveSample("Quotations")}}

 
-
詩

+
詩

 
 
<figure>
   <p style="white-space:pre">
@@ -129,7 +133,7 @@ Love is a spirit all compact of fire,
 
 
{{EmbedLiveSample("Poems", "100%", 250)}}

 
-
仕様書

+
仕様書

 
 
@@ -158,13 +162,13 @@ Love is a spirit all compact of fire,
  

  
 

 
-
ブラウザーの互換性

+
ブラウザーの互換性

 
-
+
 
 
{{Compat("html.elements.figure")}}

 
-
関連情報

+
関連情報

 
 
    
  
  • {{HTMLElement("figcaption")}} 要素
    • 
-- 
cgit v1.2.3-54-g00ecf