Pengantar MathML - Bahasa Markup untuk Matematika

MathML adalah bahasa markup yang dapat digunakan untuk menampilkan notasi matematika. Anda dapat menggunakan tag MathML langsung dari HTML5. Ini berguna ketika Anda ingin menunjukkan lebih dari notasi sederhana Matematika di halaman web Anda, dan itu cukup mudah digunakan karena kesederhanaan dan kemiripan dengan HTML.

MathML memiliki dua jenis markup; presentasi (untuk tata letak) dan konten (untuk makna). Karena hanya markup presentasi yang didukung oleh browser, itulah satu-satunya jenis markup yang dapat digunakan dengan HTML. Anda juga dapat menggunakan CSS dan JavaScript di atasnya seperti yang Anda lakukan pada HTML.

Mari kita lihat MathML.

Memahami MathML

Ada daftar elemen MathML yang ada di situs web Pengembang Mozilla. Saya juga mencantumkan elemen yang digunakan dalam contoh di akhir posting ini untuk referensi cepat.

Elemen tingkat atas dalam MathML adalah $$ elemen, Ketika Anda menulis kode MathML dalam HTML, ingatlah untuk meletakkannya di dalam $$ tag.

,,, adalah elemen dasar yang mewakili masing-masing pengidentifikasi, operator, angka dan string. Perhatikan bahwa semua elemen MathML di bawah ini dimulai dengan huruf 'm'.

Berikut ini beberapa contoh sederhana.

Cara Menampilkan Superscript & Subscript

Itu elemen untuk menampilkan superscript. Ada sebuah untuk subskrip.

$n^7$ 

Cara Menampilkan Pecahan

$\frac{7}{26}$ 

Cara Menampilkan Integer Root

Inilah satu lagi contoh sederhana untuk menampilkan integer root.

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

Untuk root kuadrat saja, ada .

Sekarang mari kita beralih ke notasi yang lebih kompleks, yaitu matriks.

Cara Menampilkan Matriks

Untuk membangun sebuah matriks, kita perlu memiliki struktur tabel untuk baris dan kolom. Untuk ini, kami gunakan , dan .

Selain itu, kami akan menggunakan tag untuk menambahkan operator [ dan ] di sekitar matriks, dan akhirnya menempatkan mereka semua di dalam elemen, elemen yang mengelompokkan ekspresi.

Inilah hasil akhirnya:

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

Juga, mari kita masukkan sedikit CSS untuk membuat 'X' menonjol dalam matriks.

mi color: red;  

Cara Menampilkan Persamaan Integral

Di bawah ini adalah contoh dari tipe dasar persamaan integral. Itu digunakan untuk menambah batas integral.

Seperti HTML, MathML juga memiliki karakter dan entitas, salah satunya digunakan dalam contoh untuk menunjukkan simbol phi Yunani. Berikut ini cara menampilkan persamaan integral di atas:

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

Untuk daftar entitas karakter MathML, klik di sini untuk menemukannya di situs web W3C.

Atribut MathML

Terlepas dari atribut yang sama dengan HTML (seperti id), MathML juga memiliki seperangkat atribut mereka sendiri. Situs Pengembang Mozilla memiliki koleksi atribut MathML untuk referensi Anda. Untuk mundur, Anda dapat menggunakan perpustakaan JavaScript MathJax. Jika Anda membutuhkan lebih banyak alat, lihat tautan ini di sini.

Saya mengambil cuti saya dengan codepen ini yang berisi semua contoh di atas, untuk referensi mudah Anda.

Daftar Referensi Elemen MathML