|
0
|
1 <!doctype html>
|
|
|
2 <html lang="ru">
|
|
|
3
|
|
|
4 <head>
|
|
|
5 <meta charset="utf-8">
|
|
|
6 <title>CSS сниппеты</title>
|
|
|
7 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
|
8 <link rel="stylesheet" href="/man/css/prism.css">
|
|
|
9 <link rel="stylesheet" href="/man/css/styles.css">
|
|
|
10 <style>
|
|
|
11
|
|
|
12 </style>
|
|
|
13 </head>
|
|
|
14 <body>
|
|
|
15 <main>
|
|
|
16
|
|
|
17 <h2>Подключение шрифтов</h2>
|
|
|
18
|
|
|
19 <p>Если нижеприведенного кода мало, то больше опций можно найти в <a href="https://developer.mozilla.org/ru/docs/Web/CSS/@font-face" target=_blank>MDN</a>.</p>
|
|
|
20
|
|
|
21 <pre class=language-css><code>/* latin */
|
|
|
22 @font-face {
|
|
|
23 font-family: 'Open Sans';
|
|
|
24 src: local("Open Sans"),
|
|
|
25 url(/template/open-sans-lat.woff) format('woff'),
|
|
|
26 url(/template/open-sans-lat.woff2) format('woff2');
|
|
|
27 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
|
28 }
|
|
|
29
|
|
|
30 /* cyrillic */
|
|
|
31 @font-face {
|
|
|
32 font-family: 'Open Sans';
|
|
|
33 src: local("Open Sans"),
|
|
|
34 url(/template/open-sans-cyr.woff) format('woff'),
|
|
|
35 url(/template/open-sans-cyr.woff2) format('woff2');
|
|
|
36 unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
|
|
37 }</code></pre>
|
|
|
38
|
|
|
39 <h2>Определение переменных</h2>
|
|
|
40
|
|
|
41 <pre class=language-css><code>:root {
|
|
|
42 --sans-serif: system-ui, sans-serif;
|
|
|
43 --monospace: "consolas", monospace;
|
|
|
44 }</code></pre>
|
|
|
45
|
|
|
46 </main>
|
|
|
47 <script src=/man/js/prism.js></script>
|
|
|
48 </body>
|
|
|
49 </html>
|
