LovesTheTeam.com

Інструкція

1

Можна вказати параметри шрифту, Який браузеру слід використовувати длявідображення того чи іншого блоку тексту в сторінці, безпосередньо перед початком цього блоку. Для цього достатньо коштів мови розмітки, без залучення стильових описів елементів документа. Відповідна HTML-конструкція складається з відкриває і закриває тегів font (<font> і </ font>), між якими і розміщується текст. Цей тег дозволяє вказати ім'я шрифту в атрибуті face, його колір (в атрибуті color) ірозмір (атрибут size). Колір можна задавати в його текстовому позначенні (наприклад, Blue), але краще використовувати шістнадцяткові коди (наприклад, # 0000FF замість Blue), так як з їх допомогою можна більш точно підібрати потрібний відтінок. Розмір шрифту тут задається у відносних одиницях - вам потрібно вказати число в діапазоні від 1 до 7. Зразок тексту із заданими таким способом параметрами шрифту: <Font color = "Navy" face = "Verdana" size = "5"> Зразок тексту </ font>

2

Інший спосіб - скористатися атрибутом style. Його можна вказувати в багатьох тегах, в тому числі формують рядкові або блокові області з текстом в тілі документа. Ось приклад з тегом, що формує один параграф тексту: <p style = "font: 700 20px / 12 Verdana;"> Зразок тексту </ p> Тут число 700 - це властивість font-weight, а 20px - font-size. За ефектом вони практично дублюють один одного - задають розмір букв. Різниця лише в тому, що font-size вказує розміри в абсолютних одиницях (px або em), а font-weight в відносних, тобто збільшує або зменшує розмір цього текстового блоку щодо заданого для всього документа в цілому. Як ви розумієте, використовувати обидва одночасно в одному стильовому атрибуті немає сенсу, тут вони об'єднані тільки в якості прикладу. Число 12, вказане через дріб після абсолютного розміру, задає висоту рядків в цьому параграфі. А Verdana - це, звичайно, ім'я використовуваного шрифту.

3

Однак вказівка ​​параметрів шрифту безпосередньо в тегах елементів сторінки заразвикористовується рідко. Як правило, опису шрифтів виносяться в CSS-блоки, а в тегах зазначаються тільки посилання на них - в атрибутах class або id. Зразок цього типу вказівки параметрів шрифту: <Style type = "text / css"> .paraFont {font: 20px / 40 Verdana;} </ style> <p class = "paraFont"> Зразок тексту </ p>

4

Якщо особливого розмаїття шрифтів у сторінці немає,то можна задати параметри, наприклад, для всіх тегів <p> і не вказувати посилань на стильове опис ні в атрибуті class, ні в id. У цьому випадку попередній зразок можна спростити до такого виду: <style type = "text / css"> p {font: 20px / 40 Verdana;} </ style> <p> Зразок тексту </ p>

Рада 2: Як задати своє шрифт в html

Шрифт - невід'ємна частина веб-дизайну, що надаєсайту характерний стиль. Якісний текст на сторінці має виглядати гармонійно, поєднуватися з іншими елементами сайту і при цьому сприяти кращому сприйняттю інформації. За допомогою мови розмітки HTML і каскадних таблиць CSS можна налаштувати практично будь-які параметри, що сприяють досягненню максимальної ефективності сторінки.

Вам знадобиться

• - файл шрифту в форматі TTF.

Інструкція

1

Для використання набору шрифтів, встановлених на комп'ютері, можна скористатися параметром font-family каскадних таблиць стилів. Для цього введіть наступний код для потрібного елемента:

текст

Дана команда виведе заголовок другого рівня h2 текстом гарнітури Arial.

2

Якщо ви хочете використовувати власний шрифт,його попередньо необхідно завантажити на хостинг і включити за допомогою відповідної команди. Файли TTF включаються за допомогою такої команди: @ font-face {font-family: font; src: url (font.ttf); } Атрибут font-family в даному випадку задає назву гарнітурі шрифту, а src: url (font.ttf) вказує шлях до файлу TTF.

3

Після включення елемента можна використовувати його для відображення тексту:

текст

Дана команда відповідає за виведення необхідногошрифту font курсивом в заголовку другого рівня. Якщо браузер користувача не підтримує обробку файлів TTF, буде використовуватися вказаний після першої коми системний шрифт (в даному випадку Verdana).

4

Деякі браузери не підтримують завантаженняTTF. Наприклад, Internet Explorer 8 для відображення тексту використовує формат EOT. Для таких оглядачів конвертує вихідний TTF за допомогою численних сервісів і включіть отриману гарнітуру в параметр @ font-face аналогічним чином.

5

Якщо ви хочете імпортувати потрібний вам файл з іншого ресурсу, скористайтеся командою @import, яку необхідно прописати вгорі документа CSS: @import url (http: // адрес_шріфта)