Einführung in MathML - Die Markup-Sprache für Mathematik

MathML ist eine Auszeichnungssprache, die verwendet werden kann Anzeige mathematischer Notationen. Sie können MathML-Tags direkt aus HTML5 verwenden. Dies ist nützlich, wenn Sie mehr als nur einfache Notizen von Math auf Ihren Webseiten anzeigen möchten Einfachheit und Ähnlichkeit mit HTML.

In MathML gibt es zwei Arten von Markierungen. Präsentation (für Layout) und Inhalt (für Bedeutung). Da nur das Präsentations-Markup von Browsern unterstützt wird, ist dies der einzige Markup-Typ, der mit HTML verwendet werden kann. Sie können CSS und JavaScript ebenso wie HTML verwenden.

Lassen Sie uns einen Blick auf MathML werfen.

Grundlegendes zu MathML

Auf der Mozilla Developer-Website befindet sich eine Liste der vorhandenen MathML-Elemente. Ich habe auch die Elemente aufgelistet, die in den Beispielen am Ende dieses Beitrags zum schnellen Nachschlagen verwendet werden.

Das oberste Element in MathML ist das $$ Wenn Sie MathML-Code in den HTML-Code schreiben, denken Sie daran, sie in das HTML-Element zu schreiben $$ Stichworte.

,,, sind die Grundelemente, die jeweils einen Bezeichner, einen Operator, eine Nummer und eine Zeichenfolge darstellen. Beachten Sie, dass alle unten stehenden MathML-Elemente mit dem Buchstaben 'm' beginnen..

Hier einige einfache Beispiele.

Anzeige von hochgestelltem und tiefgestelltem Index

Das Element ist zur Anzeige von hochgestellten Zeichen. Dort ist ein für Indizes.

$n^7$ 

So zeigen Sie Brüche an

$\frac{7}{26}$ 

So zeigen Sie Root Integer an

Hier ist ein weiteres einfaches Beispiel für die Anzeige von Ganzzahlen.

$\sqrt[5]{\mathrm{<mo>-</mo>678}}$ 

Für nur Quadratwurzel gibt es .

Kommen wir nun zu komplexeren Notationen, der Matrix.

So zeigen Sie eine Matrix an

Um eine Matrix zu erstellen, benötigen wir eine Tabellenstruktur für Zeilen und Spalten. Dafür verwenden wir , und .

Abgesehen davon verwenden wir die Tags, um die Operatoren hinzuzufügen [ und ] um die Matrix herum und steckte sie alle in die Element, ein Element, das Ausdrücke gruppiert.

Hier ist das Endergebnis:

$\left[\begin{array}{ccc}0& 4& 10\\ 5& 2& X\\ 9& 11& 1\end{array}\right]$ 

Lassen Sie uns auch ein wenig CSS hinzufügen, damit das 'X' in der Matrix hervorgehoben wird.

mi Farbe: rot;  

So zeigen Sie Integralgleichungen an

Nachfolgend finden Sie ein Beispiel für einen grundlegenden Typ einer Integralgleichung. Das wird verwendet, um die Grenzwerte zum Integral hinzuzufügen.

Wie HTML hat MathML auch Zeichen und Entitäten, von denen eine im Beispiel verwendet wird, um das griechische Phi-Symbol anzuzeigen. So zeigen Sie die Integralgleichung oben an:

$f\left(x\right)=\int _{\mathrm{ein}}^{b}K(x,t)\phi \left(t\right)dt$ 

Um eine Liste der MathML-Zeichenelemente anzuzeigen, klicken Sie hier, um sie auf der W3C-Website zu finden.

MathML-Attribute

Abgesehen von Attributen, die mit HTML identisch sind (wie Ich würde), Hat MathML auch eine Reihe eigener Attribute. Die Mozilla Developer Site enthält eine Sammlung von MathML-Attributen als Referenz. Für Fallbacks können Sie die JavaScript-Bibliothek MathJax verwenden. Wenn Sie weitere Tools benötigen, klicken Sie hier.

Ich verabschiede mich mit diesem Codepen, der alle oben genannten Beispiele enthält, als Referenz.

Referenzliste der MathML-Elemente