До выхода HTML5 использование формул было сущим наказанием. Судите сами: в 2005-м необходимо было иметь под рукой либо специальный браузер, либо разбивать текст на собственно HTML и вставки из изображений или PDF. Поиск и прочие операции редактирования и/или вывода на экран/бумагу был неоднозначной задачей, коей посвящались целые монографии.
В 2012-м было уже попроще. Появилась возможность подключать необходимые плагины (Firemath для FireFox и Daum Equation Editor для Chrome). Но неоднозначность стандартов (и поддержки) фактически заставляла писать одну и ту же статью для каждого из браузеров (и для их версий). Или встречать пользователей волшебным приветствием «Ваш браузер надо обновить/дополнить расширением».
Неудобно? — Да! Отнимало много времени на поиск универсального решения? — Да! Заставляет думать о том, какой тип записи лучше (презентационный или содержательный), каким конвертером пользоваться (а их только общеизвестных с десятка полтора)? — ДА! ДА! ДА!
В результате работа по публикации превращалась в освоение двух-трех лексиконов разметки и изучения работы минимум одной программы-перекодировщика.
Теперь, с приходом HTML5, все стало намного проще. В нем появился новый контейнер <math> .
Каждый допустимый экземпляр MathML должен быть внутри этого контейнера. Он не допускает вложений, но внутри может быть произвольное число других дочерних элементов.
Атрибуты тэга
В дополнение к следующим атрибутам, тэг <math> воспринимает любые атрибуты из <mstyle>.
class, id, style
При условии использования вместе с таблицами стилей .
dir
Указывает направление формулы: ltr — слева направо или rtl — справа налево.
ref
Используется для установки гиперссылки на указанный URI.
mathbackground
Цвет фона. Вы можете использовать #rgb, #rrggbb и названия цветов HTML .
mathcolor
Цвет текста. Вы можете использовать #rgb, #rrggbb и названия цветов HTML .
display
Этот атрибут определяет способ вывода. Возможные значения:
<b>block</b>— означает, что этот элемент будет отображаться за пределами текущего диапазона текста, как блока, который может быть расположен в любом месте без изменения смысла текста;inline-означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из нее без изменения значения этого текста.
Значение по умолчанию inline .
mode
Устаревшие значение display attribute.
Возможные значения: display (который имеет тот же эффект, как display="block" ) и inline .
overflow
Определяет, как выражение ведет себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.
Возможные значения: linebreak (по умолчанию), scroll, elide, truncate, scale .
Представление в HTML5
<!DOCTYPE html>
<html>
<head>
<title>MathML in HTML5</title>
</head>
<body>
<math>
<mrow>
<mrow>
<msup>
<mi>a</mi>
<mn>2</mn>
</msup>
<mo>+</mo>
<msup>
<mi>b</mi>
<mn>2</mn>
</msup>
</mrow>
<mo>=</mo>
<msup>
<mi>c</mi>
<mn>2</mn>
</msup>
</mrow>
</math>
</body>
</html>
Представление в XHTML
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>MathML in XHTML</title>
</head>
<body>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mrow>
<msup>
<mi>a</mi>
<mn>2</mn>
</msup>
<mo>+</mo>
<msup>
<mi>b</mi>
<mn>2</mn>
</msup>
</mrow>
<mo>=</mo>
<msup>
<mi>c</mi>
<mn>2</mn>
</msup>
</mrow>
</math>
</body>
</html>
Примечания: XHTML документы с MathML должны быть поданы как application/xhtml+xml . Вы можете легко добиться этого, добавив .xhtml расширение для локальных файлов. Для серверов Apache вы можете настроить .htaccess файл для этого расширения на правильный тип MIME. Поскольку мы сохранили наш MathML в виде XML-документа, необходимо быть уверенным в правильно оформленном XML-документе.
| Особенность | Android | Chrome для Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Обозначения XHTML | Не поддерживается | Не поддерживается | 1,0 (1,0) | Не поддерживается | Не поддерживается | Не поддерживается |
| Обозначения HTML5 | Не поддерживается | Не поддерживается | 4,0 (2,0) | Не поддерживается | Не поддерживается | Не поддерживается |
dir |
Не поддерживается | Не поддерживается | 12,0 (12,0) | Не поддерживается | Не поддерживается | Не поддерживается |
href |
Не поддерживается | Не поддерживается | 7,0 (7,0) | Не поддерживается | Не поддерживается | Не поддерживается |
mathbackground |
Не поддерживается | Не поддерживается | 4,0 (2,0) | Не поддерживается | Не поддерживается | Не поддерживается |
mathcolor |
Не поддерживается | Не поддерживается | 4,0 (2,0) | Не поддерживается | Не поддерживается | Не поддерживается |
overflow |
Не поддерживается | Не поддерживается | Не поддерживается | Не поддерживается | Не поддерживается | Не поддерживается |
<mstyle> элемента). Тем не менее, displaystyle атрибут не отрабатывается. Его поддержка была добавлена в Gecko 8.0 (Firefox 8.0 / Thunderbird 8.0 / SeaMonkey 2.5).
Альтернативные текстовые описания (alttext) или ссылки на альтернативное изображение, (атрибуты altimg, altimg-width, altimg-height и altimg-valign) в настоящее время не реализованы в Gecko.
| MathML 3.0 | Рекомендация | Текущая спецификация |
| MathML 2.0 | Рекомендация | Начальная спецификация |
Надеюсь, развитие этого нужного и полезного тэга продолжится.
Автор: Sykoku
