aboutsummaryrefslogtreecommitdiff
path: root/files/ja/web/mathml/element/math/index.html
blob: eaf35513f8c8a8a596ed73d7010c118221d1f4d0 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
---
title: <math>
slug: Web/MathML/Element/math
tags:
  - MathML
  - MathML Reference
  - 'MathML:Element'
  - 'MathML:要素'
translation_of: Web/MathML/Element/math
---
<div>{{MathMLRef}}</div>

<p class="summary">MathML における最上位の要素は <code>&lt;math&gt;</code> です。有効な MathML のインスタンスはすべて <code>&lt;math&gt;</code> タグに囲まれています。加えて、 <code>&lt;math&gt;</code> 要素を入れ子状に配置してはなりませんが、中にその他の子要素をいくつでも持つことができます。</p>

<h2 id="Attributes" name="Attributes">属性</h2>

<p>以下に示す属性に加え、 <code>&lt;math&gt;</code> 要素は {{ MathMLElement("mstyle") }} 要素のすべての属性を受け入れます。</p>

<dl>
 <dt id="attr-class-id-style">class, id, style</dt>
 <dd><a href="/ja/docs/CSS">スタイルシート</a>と一緒に使用するために提供されます。</dd>
 <dt id="attr-dir">dir</dt>
 <dd>数式全体の書字方向。値として <code>ltr</code> (左書き) と <code>rtl</code> (右書き) が指定可能です。</dd>
 <dt id="attr-href">href</dt>
 <dd>指定された URI へのハイパーリンクの設定に使用されます。</dd>
 <dt id="attr-mathbackground">mathbackground</dt>
 <dd>背景色。 <code>#rgb</code>, <code>#rrggbb</code>, <a href="/ja/docs/CSS/color_value#Color_Keywords">HTML 色名</a>が使用できます。</dd>
 <dt id="attr-mathcolor">mathcolor</dt>
 <dd>文字色。 <code>#rgb</code>, <code>#rrggbb</code>, <a href="/ja/docs/CSS/color_value#Color_Keywords">HTML 色名</a>が使用できます。</dd>
 <dt id="attr-display">display</dt>
 <dd>この列挙属性は、囲まれた MathML マークアップをレンダリングする方法を指定します。これは、次のいずれかの値を持つことができます。
 <ul>
  <li><code>block</code> は、この要素が現在のテキストの区間の外に、テキストの意味を変えることなく任意の場所に配置することができるブロックとして表示されることを意味します。</li>
  <li><code>inline</code> は、この要素が現在のテキストの区間の内側に表示され、そのテキストの意味を変えることなくその区間の外に移動することができないことを意味します。</li>
 </ul>

 <p>存在しない場合、既定値は <code>inline</code> です。</p>
 </dd>
 <dt id="attr-mode">mode {{deprecated_inline}}</dt>
 <dd>非推奨であり、 <a href="/ja/docs/MathML/Element/math#attr-display">display 属性</a>で置き換えられました。<br>
 取りうる値は <code>display</code> (これは <code>display="block"</code> と同じ効果を持ちます) および <code>inline</code> です。</dd>
 <dt id="attr-overflow">overflow</dt>
 <dd>許可された幅に収まらないほど長い場合に、式がどのように動作するかを指定します。<br>
 取りうる値は <code>linebreak</code> (既定値), <code>scroll</code>, <code>elide</code>, <code>truncate</code>, <code>scale</code> です。</dd>
</dl>

<h2 id="Examples" name="Examples"></h2>

<p><img alt="Theorem of Pythagoras" src="/files/3157/math.jpg"></p>

<h3 id="HTML5_notation" name="HTML5_notation">HTML5 表記</h3>

<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;MathML in HTML5&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;

  &lt;math&gt;
    &lt;mrow&gt;
      &lt;mrow&gt;
        &lt;msup&gt;
          &lt;mi&gt;a&lt;/mi&gt;
          &lt;mn&gt;2&lt;/mn&gt;
        &lt;/msup&gt;
        &lt;mo&gt;+&lt;/mo&gt;
        &lt;msup&gt;
          &lt;mi&gt;b&lt;/mi&gt;
          &lt;mn&gt;2&lt;/mn&gt;
        &lt;/msup&gt;
      &lt;/mrow&gt;
      &lt;mo&gt;=&lt;/mo&gt;
      &lt;msup&gt;
        &lt;mi&gt;c&lt;/mi&gt;
        &lt;mn&gt;2&lt;/mn&gt;
      &lt;/msup&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;

  &lt;/body&gt;
&lt;/html&gt;
</pre>

<h3 id="XHTML_notation" name="XHTML_notation">XHTML 表記</h3>

<pre class="brush: xml notranslate">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
 &lt;title&gt;MathML in XHTML&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;

  &lt;math xmlns="http://www.w3.org/1998/Math/MathML"&gt;
    &lt;mrow&gt;
      &lt;mrow&gt;
        &lt;msup&gt;
          &lt;mi&gt;a&lt;/mi&gt;
          &lt;mn&gt;2&lt;/mn&gt;
        &lt;/msup&gt;
        &lt;mo&gt;+&lt;/mo&gt;
        &lt;msup&gt;
          &lt;mi&gt;b&lt;/mi&gt;
          &lt;mn&gt;2&lt;/mn&gt;
        &lt;/msup&gt;
      &lt;/mrow&gt;
      &lt;mo&gt;=&lt;/mo&gt;
      &lt;msup&gt;
        &lt;mi&gt;c&lt;/mi&gt;
        &lt;mn&gt;2&lt;/mn&gt;
      &lt;/msup&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;

&lt;/body&gt;
&lt;/html&gt;</pre>

<p><strong>メモ</strong>: MathML をもつ XHTML 文書は <code>application/xhtml+xml</code> として配信しなければなりません。これは、ローカルファイルに <code>.xhtml</code> 拡張子を追加することで、簡単に達成できます。 Apache サーバーの場合は、 <a class="external" href="http://httpd.apache.org/docs/2.4/mod/mod_mime.html#addtype"><code>.htaccess</code> ファイルを設定する</a>ことで拡張子を正しい MIME タイプに対応付けることができます。 XML 文書で MathML を表記するので、整形式の XML 文書を必ず記述してください。</p>

<h2 id="Specifications" name="Specifications">仕様書</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">仕様書</th>
   <th scope="col">状態</th>
   <th scope="col">備考</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{ SpecName('MathML3', 'chapter2.html#interf.toplevel', 'The Top-Level math Element') }}</td>
   <td>{{ Spec2('MathML3') }}</td>
   <td>現在の仕様</td>
  </tr>
  <tr>
   <td>{{ SpecName('MathML2', 'chapter7.html#interf.toplevel', 'The Top-Level math Element') }}</td>
   <td>{{ Spec2('MathML2') }}</td>
   <td>初期の仕様</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

<p>{{Compat("mathml.elements.math")}}</p>

<h2 id="Firefox-specific_notes" name="Firefox-specific_notes">Firefox 固有のメモ</h2>

<p>Firefox 7 では、最上位の math 要素がすべての MathML 属性を受け入れる対応を導入しました (すなわち {{ MathMLElement("mstyle") }} 要素と同じ動作)。しかし、 <code>displaystyle</code> 属性が含まれておらず、 Firefox 8 で<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=669719">追加されました</a></p>

<p>テキストの代替 (<code>alttext</code>) または <code>altimg</code>, <code>altimg-width</code>, <code>altimg-height</code>, <code>altimg-valign</code> の各属性を使用する代替画像の参照は、現在は Firefox に実装されていません。</p>

<h2 id="See_also" name="See_also">関連情報</h2>

<ul>
 <li>HTML の最上位要素: {{ HTMLElement("html") }}</li>
 <li>SVG の最上位要素: {{ SVGElement("svg") }}</li>
 <li><a href="http://eyeasme.com/Joe/MathML/MathML_browser_test.html">MathML ブラウザーテスト</a></li>
</ul>