ホームページ上で数学の公式をHTMLで表示させる方法とは？
- ホームページ上で数学の公式をHTMLで表示させるための最もスマートな方法について教えてください。
- 数式の見た目を整えるためにHTMLで特殊な記述が必要なのか、または画像で作成する必要があるのか教えてください。
- ホームページ上で数学の公式を表示させる方法についてアドバイスをお願いします。
- ベストアンサー
ホームページ上で数学の公式を表示
ホームページ上で数学の公式をHTMLで表示させることは可能でしょうか？ もちろん１行で書ける式などではなく、例えば・・・ 1/√5 - √3 自分に出来る表現がこの様な感じなので・・・。 特に、分母と分子があり、更にそれぞれに二乗などの表現を行いたい場合、どの様に記述するのが最もスマートな方法になりますでしょうか？ これは実際の計算式ではなく、あくまで表示（見た目）についての質問です。 3の3乗は計算では3^3とかで対応できると思うのですが、見た目で3乗の文字を小さく右上に。。 また、この様な数式をHTMLであらわすためには何か特殊なものが用意されていたりするのでしょうか？例えばHTMLのルビの様なもの？ 上手く伝えれず申し訳ありません。 参考用の画像を添付して見ます。 この様に、画像で作成しなければなりませんでしょうか？ 何か方法をご存知の方いらっしゃいましたら、アドバイス頂けますと助かります。 宜しくお願いします。
- oneday77
- お礼率56% (91/162)
- HTML
- 回答数3
- ありがとう数1
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
HTMLはその出生が科学技術文書なので、表示されて当然なのですが、残念ながら・・ しかし、次期HTML5ではmathMLが使えることになっています。 また、XMLで記述すれば、IEでもTechexplorerなどを使えば表示できるかと思います。 随分前(0.9.9あたり)から、firefoxはmathMLに対応していますから、下記が添付図のように表示できます。 ★firefoxをご利用ください。が一番簡単でしょう。 数式を書かれるなら、多分Texの書き方はご存知でしょうから、TexをmathMLに置換するツールは沢山あります。 下記はTexで書けば、 \left( x+\dfrac {a} {2}\right) ^{2}-\left( \dfrac {b} {2}\right) ^{2}=0 \chi =\dfrac {-b\pm \sqrt {b^{2}-4ac}} {2a} ★HTML5です。タブは＿に置換してあるので戻すこと。文字コードはUTF-8です。 <!doctype html> <html> <head> ＿<meta charset="utf-8"> ＿<title>サンプル</title> ＿<meta name="description" content=""> ＿<meta name="author" content="IRUKA"> ＿＿<!--[if IE]> ＿＿＿<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> ＿＿＿<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script> ＿＿<![endif]-->＿<link rel="stylesheet" href="css/style.css"> <style media="screen"> <!-- p.mathML{font-size:2em;margin:0.5em 1em;} --> </style> </head> <body> ＿<header> ＿＿<h1 id="title">Your title</h1> ＿＿<nav> ＿＿＿<ul> ＿＿＿＿<li><a href="#">Some</a></li> ＿＿＿＿<li><a href="#">navigation</a></li> ＿＿＿＿<li><a href="#">links</a></li> ＿＿＿</ul> ＿＿</nav> ＿</header> ＿<section> ＿＿<aside> ＿＿＿<h3>Something aside</h3> ＿＿</aside> ＿＿<h2>A smaller heading</h2> ＿＿<p class="mathML"> ＿＿＿<math xmlns="http://www.w3.org/1998/Math/MathML"> ＿＿＿＿<mstyle displaystyle="true"> ＿＿＿＿＿<msup> ＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿<mfenced> ＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿<mi> x </mi> ＿＿＿＿＿＿＿＿＿<mo> + </mo> ＿＿＿＿＿＿＿＿＿<mfrac> ＿＿＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿＿＿<mi> a </mi> ＿＿＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿＿＿<mn> 2 </mn> ＿＿＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿＿＿</mfrac> ＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿</mfenced> ＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿<mn> 2 </mn> ＿＿＿＿＿＿</mrow> ＿＿＿＿＿</msup> ＿＿＿＿＿<mo> - </mo> ＿＿＿＿＿<msup> ＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿<mfenced> ＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿<mfrac> ＿＿＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿＿＿<mi> b </mi> ＿＿＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿＿＿<mn> 2 </mn> ＿＿＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿＿＿</mfrac> ＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿</mfenced> ＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿<mn> 2 </mn> ＿＿＿＿＿＿</mrow> ＿＿＿＿＿</msup> ＿＿＿＿＿<mo> = </mo> ＿＿＿＿＿<mn> 0 </mn> ＿＿＿＿</mstyle> ＿＿＿</math> ＿＿</p> ＿＿<p class="mathML"> ＿＿＿<math xmlns="http://www.w3.org/1998/Math/MathML"> ＿＿＿＿<mstyle displaystyle="true"> ＿＿＿＿＿<mi> x </mi> ＿＿＿＿＿<mo> = </mo> ＿＿＿＿＿<mfrac> ＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿<mo> - </mo> ＿＿＿＿＿＿＿<mi> b </mi> ＿＿＿＿＿＿＿<mo> ±<!--plus-minus sign--> </mo> ＿＿＿＿＿＿＿<msqrt> ＿＿＿＿＿＿＿＿<msup> ＿＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿＿<mi> b </mi> ＿＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿＿＿＿<mn> 2 </mn> ＿＿＿＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿＿＿</msup> ＿＿＿＿＿＿＿＿<mo> - </mo> ＿＿＿＿＿＿＿＿<mn> 4 </mn> ＿＿＿＿＿＿＿＿<mi> a </mi> ＿＿＿＿＿＿＿＿<mi> c </mi> ＿＿＿＿＿＿＿</msqrt> ＿＿＿＿＿＿</mrow> ＿＿＿＿＿＿<mrow> ＿＿＿＿＿＿＿<mn> 2 </mn> ＿＿＿＿＿＿＿<mi> a </mi> ＿＿＿＿＿＿</mrow> ＿＿＿＿＿</mfrac> ＿＿＿＿</mstyle> ＿＿＿</math> ＿＿</p> ＿</section> ＿<section> ＿＿<h2>A smaller heading</h2> ＿＿<p> ＿＿</p> ＿</section> ＿<footer> ＿＿<h3>A nice footer</h3> ＿</footer> </body> </html>
その他の回答 (2)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
追加情報です。最新ブラウザが使えれば、ネイティブで表示できないのはIEだけのようですね。 ⇒MathML情報( http://www.fukuoka-edu.ac.jp/~fujimoto/mathml.html ) こちらは古い ⇒MathMLに対応したブラウザ：北大文「魅力ある大学院教育」( http://humansci.let.hokudai.ac.jp/m/terao/stat/browse/browser.html ) これで見るとfirefoxのみ７年前から・・ 以下は作成方法など ⇒Authoring MathML for Mozilla( http://www.mozilla-japan.org/projects/mathml/authoring.html ) ⇒MathML( http://www.jagat.or.jp/sgml/mathml/ ) ⇒Mathematical Markup Language - Wikipedia( http://ja.wikipedia.org/wiki/Mathematical_Markup_Language )
- askaaska
- ベストアンサー率35% (1455/4149)
スタイルシートやフォントを駆使すれば はかなり何とかなると思うけど 基本的には無茶 画像で表現するのが一般的 ちなみに指数ならsupタグでそれっぽくできるわ それくらいね あとははてなダイアリーなどのブログサービスやMediaWikiなどを使えば 規則にのっとって記述したものを自動的に数式画像に変換してくれたりするけど それくらいじゃないかしら
関連するQ&A
- 組み合わせの公式について教えて
久しぶりに数学勉強してます。 組み合わせの問題は公式を使えば簡単にできるのですが、 なんで組み合わせの公式は分母と分子になってるのかわかりません。 なにかこの公式を理解できる方法ありましたらおしえてください。
- ベストアンサー
- 数学・算数
- 二次方程式の解の公式による計算について
x^ - 2x - 15 = 0 上の式を二次方程式の解の公式に代入したら 2±√64 / 2 x=5,x=-3 の答えになるそうですが 2±√64 / 2 ここからの計算方法を ご教授いただきたいのですが。 ＾は2乗です x はエックスです 分子 / 分母 です
- ベストアンサー
- 数学・算数
- 分数や累乗はHTMLではなく画像？
HTMLの表現方式では分数や累乗の表示が非常に難しいと思います。おおむね数学のサイトでも分数や累乗の式を画像にしていることから、やはり画像の表現のほうがいいのでしょうか？ また 分子／分母 のような表現でもいいのでしょうか？
- 締切済み
- 数学・算数
- 【数学・乗法公式はどういうときに役立つのか？】
【数学・乗法公式はどういうときに役立つのか？】 乗法公式「(a+b)^2」を習ったとする。 それが「a^2+2ab+b^2」に展開出来ると知る。 で、実生活では(a+b)^2とは表現せずにa^2と表現するのが自然。 4^2=16 それをわざわざ(2+2)^2と表現するときってどんなときですか？ で、 わざわざ2^2+2*2*2+2^2だから、これは4+8+4だから16だな！ ってなる前に4^2で考えますよね？ 乗法公式は実生活でいつ使うんですか？ わざと乗法公式で展開出来る形で提供されたわざとらしい数式が数学のテストにわざわざ先生が展開出来る形でわざとらしく出題する数学オナニー問題でしか使わないのでは？
- ベストアンサー
- 数学・算数
- 数学の問題でわからないところがあるのですが
数学の問題でわからないところがあるのですが 先生等おらず独学でしているのでだれか解説できるかたがいましたらおねがいします 問 次の極限値を求めよ。(画像がひどいですが指数はすべて2です) 質問したい部分 ∴のあとに分子にｎがでてきていることと、Σがでてきていることと、一番小さい数の分母が2n二乗に なっているとはどのような理屈でなったのでしょうか。
- 締切済み
- 数学・算数
- 数学の記号表示
数学で分数を「スラッシュ」を使わずにバーの上下に分子・分母となるように書く無料ソフトなどはありますか？ また、√内に数字を入れられる表示やベクトル記号を文字の真上に表示させるものなどは何かありますか？
- 締切済み
- その他(業務ソフトウェア)
- 【数学】分数の読み方を教えてください。
【数学】分数の読み方を教えてください。 2 - 4 - 1 - 3 だと読みは「3分の1分の4分の2」って読むんですか？ あと計算の仕方が 2 - 4 - 1 - 3 が 2×3 ---- 4×1 になって 6 - 4 で 3 - 2 が答えになるのはなぜですか？ なぜ分子と分子掛けて分母と分母を掛けたら答えになるの？ 1 - 2 - 1 - 2 は半分分の半分は1個になる？？？ ケーキが半分あります その半分の半分が一個って数学は不思議な世界ですよね 分母が半分スタートなのにゴールしたら1になってるんだから何かのマジックですかと聞きたい。 しかも半分の半分の半分は1ときた。 どういうことでしょう。
- ベストアンサー
- 数学・算数
- 高校数学の問題です！！よくわかりません！！
問題はこれです！ (√5＋√3＋√2)/(√5＋√3－√2)を有理化せよ。 (√5＋√3＋√2)/(√5＋√3－√2)の分母を自分なりに有理化したのですが、答えの(√6＋√15)/3にどうしてもならないのです。僕の計算式は、 (√5+√3+√2)/{(√5+√3)－√2}×{(√5+√3)+√2)}/{(√5+√3)+√2)}として分母の√5と√3を括弧でくくって、分母の逆数となる(√5+√3)+√2をかけて有理化しようとしました。これだと計算すると(5+2√15+2√10+2√6)/3という計算になってしまいます・・・。どこが間違えているのでしょうか？ 新高１の宿題なのでとき方とかまだ高校で習っていません！！ わかりやすい回答をお願いします！！ ※数式わかりにくくてすみません！分数のＰＣでのあらわし方がわからなかったもので・・・。計算式の「/」は分数の分子と分母の間の線だと考えてください。よろしくお願いします。
- ベストアンサー
- 数学・算数
- Excel の数式エディタにセル値をリンクしたい
小学生向けに 仮分数 → 帯分数 の問題を作ろうとしています。 たとえば 4/3 = 1 + 1/3 ですが、これは小学校で教わる表現とは異なります。 小学校で教わる表現を Excel で表現するのに数式エディタを使いたいのですが、問題作成ですので、分母・分子を Excelの列に入力して、数式エディタの分母・分子にリンクさせたいのですが、そのような方法がありますでしょうか。 VBAを使用する方法でも構いませんし、Excelで無理ならばデータをExcelに入力し、問題作成は WordでするようなOfficeの複合ワザでも構いません。 ただし、できるだけExcelを使いたいのは、Excelに問題の分母・分子を入力できれば、回答を計算式で作成できるからです。 以上、よろしくお願いいたします。
- ベストアンサー
- その他MS Office製品
お礼
ORUKA1951様、有難う御座います。 なるほど、HTML5からmathMLが使えるのですね！ これは助かりますね！ >> 数式を書かれるなら、多分Texの書き方はご存知でしょうか はい、あまり詳しくは無いのですが大抵は書けるかと思います。 あと、FFで試しましたが綺麗に表示が確認出来ました。 もう少し補足頂いた情報と、ブラウザの対応状況を確認しつつmathMLで進めて見たいと思います。 本当に有難う御座いました。感謝いたします。