Вот пример страницы, с которой я недавно играл, чтобы посмотреть математические формулы в Firefox. Та часть, которая вас (вероятно) больше всего интересует, - это объявление css @font-face
вверху, а style="font-family: DejaVu Serif Web;"
назначено тегам <div>
и <math>
.
<?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" xml:lang="en" lang="en">
<head>
<title>mathy fonts test</title>
<style type="text/css">
@font-face {
font-family: DejaVu Serif Web;
src: url(/fonts/DejaVu/ttf/DejaVuSerif.ttf) format("truetype");
}
</style>
</head>
<body>
<h1>DejaVu Serif</h1>
<div style="font-family: DejaVu Serif Web;">
<p>
Nulla eu commodo neque. Donec nec nisi libero. Integer sollicitudin leo
vel arcu elementum mattis. Vivamus eu sodales odio. Curabitur eu auctor
leo. Pellentesque adipiscing nulla iaculis ante commodo aliquet. Donec
egestas tincidunt tincidunt. Nunc ut condimentum orci. Aenean in egestas
tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
posuere cubilia Curae; Curabitur suscipit, sapien ut dignissim
pellentesque, lacus risus facilisis odio, et tristique nunc quam et
mauris. Quisque pellentesque nulla et dui bibendum suscipit. Aenean
consectetur adipiscing nulla, a molestie nunc semper non. Quisque at
ipsum quis turpis gravida commodo et vel felis. Integer lobortis augue
eu tortor aliquet nec mattis nulla aliquam. Sed ornare cursus urna et
congue.
</p>
<p>
<math style="font-family: DejaVu Serif Web;" mode="display" xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>x</mi>
<mo>=</mo>
<mfrac>
<mrow>
<mo form="prefix">−<!-- − --></mo>
<mi>b</mi>
<mo>±<!-- ± --></mo>
<msqrt>
<msup>
<mi>b</mi>
<mn>2</mn>
</msup>
<mo>−<!-- − --></mo>
<mn>4</mn>
<mo>⁢<!-- ⁢ --></mo>
<mi>a</mi>
<mo>⁢<!-- ⁢ --></mo>
<mi>c</mi>
</msqrt>
</mrow>
<mrow>
<mn>2</mn>
<mo>⁢<!-- ⁢ --></mo>
<mi>a</mi>
</mrow>
</mfrac>
</mrow>
</math>
</p>
</div>
</body>
</html>
При локальном просмотре он должен быть сохранен как .xhtml, а не просто .html, что немного меня задело. Это, конечно, относится к математике, а не к шрифту, так что это всего лишь примечание, если вы пытаетесь использовать этот код целиком.
Приличный список шрифтов, которые вы можете (легально) встроить в свой документ здесь .
Typekit также предоставляет отличный способ для встраивания шрифтов, которые требуют лицензионных соглашений с литейными типами. В настоящее время они предлагают возможность использовать один шрифт (на ваш выбор) бесплатно.
Связывание шрифтов уже давно используется в браузерах; вопрос был в том, какой формат вы могли бы использовать. Microsoft, конечно, поддерживала собственный формат шрифтов, а Mozilla - нет. Вздох