Giới thiệu về MathML - Ngôn ngữ đánh dấu cho toán học

MathML là ngôn ngữ đánh dấu có thể được sử dụng để hiển thị các ký hiệu toán học. Bạn có thể sử dụng các thẻ MathML trực tiếp từ HTML5. Nó rất hữu ích khi bạn muốn hiển thị nhiều hơn các ký hiệu toán học đơn giản trong các trang web của mình và nó khá dễ sử dụng do nó đơn giản và giống với HTML.

MathML có hai loại đánh dấu; trình bày (cho bố cục) và nội dung (cho ý nghĩa). Vì chỉ có đánh dấu bản trình bày được các trình duyệt hỗ trợ, đó là loại đánh dấu duy nhất có thể được sử dụng với HTML. Bạn cũng có thể sử dụng CSS và JavaScript trên nó giống như trên HTML.

Chúng ta hãy xem MathML.

Hiểu MathML

Có một danh sách các yếu tố MathML hiện tại trong trang web Mozilla Developer. Tôi cũng đã liệt kê các yếu tố được sử dụng trong các ví dụ ở cuối bài này để tham khảo nhanh.

Phần tử mức cao nhất trong MathML là $$ phần tử, Khi bạn viết mã MathML trong HTML, hãy nhớ đặt chúng bên trong $$ thẻ.

,,, là các yếu tố cơ bản đại diện cho một định danh, toán tử, số và chuỗi tương ứng. Lưu ý rằng tất cả các phần tử MathML bên dưới bắt đầu bằng chữ 'm'.

Dưới đây là một số ví dụ đơn giản.

Cách hiển thị Siêu ký tự & Đăng ký

Các phần tử là để hiển thị siêu ký tự. Có một cho đăng ký.

$n^7$ 

Cách hiển thị phân số

$\frac{7}{26}$ 

Cách hiển thị số nguyên gốc

Đây là một ví dụ đơn giản hơn để hiển thị số nguyên gốc.

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

Chỉ với căn bậc hai, có .

Bây giờ hãy chuyển sang các ký hiệu phức tạp hơn, ma trận.

Cách hiển thị ma trận

Để xây dựng một ma trận, chúng ta sẽ cần phải có cấu trúc bảng cho các hàng và cột. Đối với điều này, chúng tôi sử dụng , và .

Ngoài ra, chúng tôi sẽ sử dụng các thẻ để thêm toán tử [ và ] xung quanh ma trận, và cuối cùng đặt tất cả chúng vào bên trong phần tử, một phần tử mà nhóm biểu thức.

Đây là kết quả cuối cùng:

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

Ngoài ra, hãy sử dụng một chút CSS để làm cho chữ 'X' nổi bật trong ma trận.

mi màu: đỏ;  

Cách hiển thị phương trình tích phân

Dưới đây là một ví dụ về một loại phương trình tích phân cơ bản. Các được sử dụng để thêm các giới hạn cho tích phân.

Giống như HTML, MathML cũng có các ký tự và thực thể, một trong số đó được sử dụng trong ví dụ để hiển thị biểu tượng phi Hy Lạp. Dưới đây là cách hiển thị phương trình tích phân ở trên:

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

Để biết danh sách các thực thể ký tự MathML, bấm vào đây để tìm chúng trên trang web của W3C.

Các thuộc tính MathML

Ngoài các thuộc tính giống với HTML (như ID), MathML cũng có một tập hợp các thuộc tính của riêng họ. Trang web Mozilla Developer có một tập hợp các thuộc tính MathML để bạn tham khảo. Đối với các dự phòng, bạn có thể sử dụng thư viện JavaScript MathJax. Nếu bạn cần thêm công cụ, hãy xem liên kết này tại đây.

Tôi xin nghỉ phép với codepen này chứa tất cả các ví dụ ở trên, để bạn dễ dàng tham khảo.

Danh sách tham khảo các phần tử MathML