Introduction à MathML - Le langage de balisage pour les mathématiques

MathML est un langage de balisage qui peut être utilisé pour afficher des notations mathématiques. Vous pouvez utiliser les balises MathML directement à partir de HTML5. Il est utile lorsque vous souhaitez afficher plus que de simples notations de Math dans vos pages Web, et qu’il est assez facile à utiliser grâce à sa simplicité et ressemblance avec HTML.

MathML a deux types de balisage; présentation (pour la mise en page) et contenu (pour le sens). Étant donné que seul le balisage de présentation est pris en charge par les navigateurs, il s'agit du seul type de balisage pouvant être utilisé avec HTML. Vous pouvez également utiliser CSS et JavaScript dessus comme vous le feriez avec HTML.

Regardons MathML.

Comprendre MathML

Il existe une liste des éléments MathML actuels sur le site Web de Mozilla Developer. J'ai également énuméré les éléments utilisés dans les exemples à la fin de cet article pour une référence rapide..

L'élément de niveau supérieur dans MathML est le $$ element, Lorsque vous écrivez du code MathML dans le code HTML, n'oubliez pas de les placer dans le $$ Mots clés.

,,, sont les éléments de base représentant un identifiant, un opérateur, un nombre et une chaîne, respectivement. Notez que tous les éléments MathML ci-dessous commencent par la lettre 'm'.

Voici quelques exemples simples.

Comment afficher un exposant et un indice

le L'élément est destiné à l'affichage en exposant. Il y a un pour les indices.

$n^7$ 

Comment afficher des fractions

$\frac{7}{26}$ 

Comment afficher les entiers de racine

Voici un autre exemple simple pour afficher les entiers racines.

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

Pour que la racine carrée, il y a .

Passons maintenant aux notations plus complexes, la matrice.

Comment afficher une matrice

Pour construire une matrice, nous aurons besoin d'une structure de table pour les lignes et les colonnes. Pour cela, nous utilisons , et .

En dehors de cela, nous allons utiliser le balises pour ajouter les opérateurs [ et ] autour de la matrice, et enfin tous les mettre à l'intérieur du element, un élément qui regroupe des expressions.

Voici le résultat final:

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

En outre, ajoutons un peu de CSS pour que le «X» se démarque dans la matrice.

mi couleur: rouge;  

Comment afficher les équations intégrales

Vous trouverez ci-dessous un exemple d’un type de base d’équation intégrale. le est utilisé pour ajouter les limites à l'intégrale.

Comme HTML, MathML comporte également des caractères et des entités, dont l'un est utilisé dans l'exemple pour afficher le symbole grec phi. Voici comment afficher l'équation intégrale ci-dessus:

$F\left(X\right)=\int _{\mathrm{une}}^{b}K(X,t)\phi \left(t\right)\mathrm{ré}t$ 

Pour obtenir une liste des entités de caractères MathML, cliquez ici pour les trouver sur le site Web du W3C..

Attributs MathML

Hormis les attributs qui sont identiques à ceux du HTML (comme identifiant), MathML possède également un ensemble de ses propres attributs. Le site de développement de Mozilla contient une collection d'attributs MathML à titre de référence. Pour les replis, vous pouvez utiliser la bibliothèque JavaScript MathJax. Si vous avez besoin de plus d'outils, consultez ce lien ici.

Je pars avec ce codepen contenant tous les exemples ci-dessus, pour votre facilité de référence.

Liste de référence des éléments MathML