|
Даю задания для студентов. Они хотят повторно пройти курс. Как отписаться от выполненного курса, что бы пройти его заново? |
Инспектор
Спонсор: Microsoft
Вы можете этот курс.
Опубликован: 29.08.2012 | Уровень: специалист | Доступ: платный
Лекция 2:
Новые возможности HTML 5
MathML
(http://comp-science.narod.ru/mml/mathml.htm)
Математики являются активными пользователями Интернета, однако до недавнего времени стандарт HTML не позволял работать с математическими формулами.Ситуация изменилась с появлением подмножества языка расширенной разметки - языка MathML. При этом математические конструкции встраиваются в обычную HTML-разметку. Корректное отображение математических символов возлагается на браузер.
Корневым элементом MathML является тэг <math>…</math>. Рассмотрим некоторые правила синтаксиса MathML.
- Идентификаторы обозначаются тегами mi: <mi>x</mi>
- Числа обозначаются тегами mn: <mn>2012</mn>
- Операторы обозначаются тегами mo: <mo>+</mo>
- Текстовая строка: ms: <ms>О сколько нам открытий чудных…</ms>
- Группировка выражений в строку: mrow:
<msqrt> <mrow> <mi>x</mi> <mo>-</mo> <mi>y</mi> </mrow> </msqrt>Результат:
- Формирование дроби mfrac:
<mfrac> <mi>x</mi> <mi>y</mi> </mfrac>Результат:
- Формирование скобок mfenced:
<mfenced> <mrow> <mi>a</mi> <mo> + </mo> <mi>b</mi> </mrow> </mfenced>Результат:
- Нижний индекс msub:
<msub> <mi>x</mi> <mn>0</mn> </msub>Результат:
- Верхний индекс msup:
<msup> <mi>x</mi> <mi>2</mi> </msup>Результат:
Рассмотрим более сложный пример - уравнение сферы (sample_5)
<!DOCTYPE html>
<html>
<head>
<title>MathML in HTML5</title>
</head>
<body>
<math>
<msup>
<mfenced>
<mrow>
<mi>x</mi>
<mo> - </mo>
<msub>
<mi>x</mi>
<mn>0</mn>
</msub>
</mrow>
</mfenced>
<mn>2</mn>
</msup>
<mo>+</mo>
<msup>
<mfenced>
<mrow>
<mi>y</mi>
<mo> - </mo>
<msub>
<mi>y</mi>
<mn>0</mn>
</msub>
</mrow>
</mfenced>
<mn>2</mn>
</msup>
<mo>+</mo>
<msup>
<mfenced>
<mrow>
<mi>z</mi>
<mo> - </mo>
<msub>
<mi>z</mi>
<mn>0</mn>
</msub>
</mrow>
</mfenced>
<mn>2</mn>
</msup>
<mo>=</mo>
<mrow>
<msup>
<mi>R</mi>
<mn>2</mn>
</msup>
</mrow>
</math>
</body>
</html>
Результат: 
Масштабируемая векторная графика - Scalable Vector Graphics (SVG)
(http://ru.wikipedia.org/wiki/SVG)
Масштабируемая векторная графика позволяет описывать в XML-формате векторную и смешанную векторно-растровую графику. В SVG-документы можно вставлять растровые изображения в форматах PNG, GIF или JPG. SVG-файлы можно читать и редактировать в обычном текстовом редакторе. Технология SVG поддерживает анимацию. Для описания динамических сцен предложен язык SMIL (SynchronizedMultimediaIntegrationLanguage). Сценарии анимации можно писать на языке JavaScript.
Рассмотрим несколько примеров создания графических изображений с помощью SVG.
Пример 1. Круг
<!DOCTYPEhtml>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<svgxmlns="http://www.w3.org/2000/svg"version="1.1">
<circlecx="100"cy="100"r="50"stroke="blue"stroke-width="1"fill="orchid"/>
</svg>
</body>
</html>
Пример 2. Треугольник
<!DOCTYPE html>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<svgxmlns="http://www.w3.org/2000/svg"version="1.1">
<polygonpoints="5 5, 30 80, 150 40"
fill="red"stroke="black"/>
</svg>
</body>
</html>
Пример 3. Текст
<!DOCTYPE html>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<svgxmlns="http://www.w3.org/2000/svg"version="1.1"width="800"height="600">
<textx="5"y="25"fill="green"font-family="Comic Sans Ms">Кто просвящен и ремеслу обучен, тот славен, горд, в компании нескучен...</text>
</svg>
</body>
</html>
Александр Лобанов
