Извлечение корня

Квадратный корень — это операция, обратная возведению в квадрат, иными словами, когда число умножается на само себя.

a = x \cdot x = x^{2} \Leftrightarrow \sqrt{x} = a

Например, квадратный корень из 9 равен 3, потому что 3 в квадрате равно 9.

3^{2} = 9; \sqrt{9} = 3

В MathML для написания квадратного корня применяется элемент <msqrt>, у которого должен быть только один дочерний элемент.

<msqrt>
  Выражение
</msqrt>

К примеру, корень из числа 16 запишется следующим образом.

<msqrt>
  <mn>16</mn>
</msqrt>

Сложные подкоренные выражения помещаются в элемент <mrow>. В примере 1 показана формула решения квадратного уравнения.

Пример 1. Использование <msqrt>

Код примера скопирован в буфер

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="utf-8">
  <title>MathML</title>
 </head>
 <body>
  <math display="block">
   <msub>
    <mi>x</mi>
    <mn>1,2</mn>
   </msub>
   <mo>=</mo>
   <mfrac>
    <mrow>
     <mo>−</mo>
     <mi>b</mi>
     <mo>±</mo>
     <msqrt>
      <mrow>
       <msup>
        <mi>b</mi>
        <mn>2</mn>
       </msup>
       <mo>−</mo>
       <mn>4</mn>
       <mi>a</mi>
       <mi>c</mi>
      </mrow>
     </msqrt>
    </mrow>
    <mrow>
     <mn>2</mn>
     <mi>a</mi>
    </mrow>
   </mfrac>
  </math>
 </body>
</html>

Знак корня

Браузеры достаточно корректно отображают знак корня, но небольшие отличия могут наблюдаться в разных браузерах и операционных системах. Это зависит от шрифта, используемого для отображения математических знаков, а также от масштаба веб-страницы. На рис. 1 показан вид квадратного корня в браузере Firefox. Тот же корень в браузере Edge показан на рис. 2.

$Корень в Firefox$

Рис. 1. Корень в Firefox

$Корень в Edge$

Рис. 2. Корень в Edge

Если такие отличия неприемлемы и требуется единообразие в разных браузерах, то для элемента <math> можно установить специальный шрифт через @font-face. Список доступных математических шрифтов, подходящих для работы MathML, можно найти на этом сайте.

trac.webkit.org/wiki/MathML/Fonts

После скачивания файла шрифта, он подключается следующим образом (пример 2).

Пример 2. Математический шрифт

Код примера скопирован в буфер

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="utf-8">
  <title>MathML</title>
  <style>
   @font-face {
    font-family: XITSMath;
    src: url('/example/font/XITSMath-Regular.woff');
   }
   math {
    font-family: XITSMath;
   }
  </style>
 </head>
 <body>
  <math display="block">
   <msqrt>
    <mrow>
     <mi>a</mi>
     <mo>+</mo>
     <mi>b</mi>
    </mrow>
   </msqrt>
  </math>
 </body>
</html>

Корень n-й степени

Если в математическом выражении требуется не квадратный корень, а кубический или корень произвольной степени, то в MathML используется элемент <mroot>. У него два дочерних элемента.

<mroot>
  Выражение
  Степень корня
</mroot>

Сперва идёт подкоренное выражение, затем степень корня. К примеру, для написания кубического корня из Z, запись будет следующая.

<mroot>
  <mi>Z</mi>
  <mn>3</mn>
</mroot>

Опять же, сложные выражения группируются с помощью элемента <mrow>, как это показано в примере 3.

Пример 3. Использование <mroot>

Код примера скопирован в буфер

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="utf-8">
  <title>MathML</title>
 </head>
 <body>
  <p>Свойство корня:</p>
  <math display="block">
   <mroot>
    <mi>a</mi>
    <mn>n</mn>
   </mroot>
   <mo>·</mo>
   <mroot>
    <mi>b</mi>
    <mn>n</mn>
   </mroot>
   <mo>=</mo>
   <mroot>
    <mrow>
     <mi>a</mi>
     <mo>·</mo>
     <mi>b</mi>
    </mrow>
    <mn>n</mn>
   </mroot>
  </math>
 </body>
</html>