Allegretto script two

Как установить шрифт PresentScript Cyrillic на сайт

Для установки шрифта «PresentScript Cyrillic» на сайт необходимо скопировать все файлы шрифта в папку, например, «fonts/presentscript-cyrillic». В файле стилей подключить шрифт, используя конструкцию CSS:

Скопировать в буфер обмена

@font-face {
	font-family: "PresentScript Cyrillic";
	src: url("../fonts/presentscript-cyrillic/presentscript-cyrillic.eot"); /* IE9 Compat Modes */
	src: url("../fonts/presentscript-cyrillic/presentscript-cyrillic.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
		url("../fonts/presentscript-cyrillic/presentscript-cyrillic.otf") format("opentype"), /* Open Type Font */
		url("../fonts/presentscript-cyrillic/presentscript-cyrillic.svg") format("svg"), /* Legacy iOS */
		url("../fonts/presentscript-cyrillic/presentscript-cyrillic.ttf") format("truetype"), /* Safari, Android, iOS */
		url("../fonts/presentscript-cyrillic/presentscript-cyrillic.woff") format("woff"), /* Modern Browsers */
		url("../fonts/presentscript-cyrillic/presentscript-cyrillic.woff2") format("woff2"); /* Modern Browsers */
	font-weight: normal;
	font-style: normal;
}

Установить шрифт «PresentScript Cyrillic» для требуемого текста, поля, кнопки или другого элемента на сайте:

font-family: "PresentScript Cyrillic";

Пример применения шрифта «PresentScript Cyrillic»:

body {
	font-family: "PresentScript Cyrillic";
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.2;
	color: #000;
	background-color: #fff;
}

Информация о шрифте Esenin script Two

Полное название шрифта

Esenin script Two Regular 400

Семейство

Начертание шрифта

Regular (Обычный)

Насыщенность шрифта

400 — нормальное (Normal)

Версия шрифта

Version 1.000 2005 initial release

Идентификатор шрифта

GophmannA.L: Esenin script Two: 2005

PostScript название шрифта

EseninscriptTwo

Авторское право на шрифт

Copyright (c) Gophmann A.L, 2005. All rights reserved.

Поддержка символов

латинские буквы, русские буквы (кириллица), цифры, знаки препинания и пунктуации

Регистр букв шрифта

верхний (прописные буквы) и нижний (строчные буквы)

Категории шрифта Esenin script Two

Бесплатные шрифты, Кириллические шрифты, Латинские шрифты, Русские шрифты

Предварительный просмотр Esenin script Two

Шрифт Esenin script Two с поддержкой латиницы

Предварительный просмотр шрифта «Esenin script Two» с прописными и строчными латинскими буквами (английский алфавит A-Z и a-z).

Шрифт Esenin script Two с поддержкой кириллицы

Предварительный просмотр шрифта «Esenin script Two» с прописными и строчными русскими буквами (кириллица, русский алфавит А-Я и а-я).

Шрифт Esenin script Two с поддержкой цифр

Предварительный просмотр шрифта «Esenin script Two» с цифрами (0 1 2 3 4 5 6 7 8 9).

Шрифт Esenin script Two с поддержкой знаков препинания и пунктуации

Предварительный просмотр шрифта «Esenin script Two» со знаками препинания и пунктуации (, . / ? ; ‘ : » { } \ | ` ~ ! @ # $ % ^ & * ( ) — _ + =).

Скачать шрифт Esenin script Two

Шрифт Esenin script Two доступен для скачивания в 6 форматах: EOT, OTF, SVG, TTF, WOFF, WOFF2 (IE9 в режиме совместимости, IE6-IE8, Open Type Font, устаревшая iOS, Safari, Android, iOS и любой современный браузер).Внимание! Скачать шрифт Esenin script Two возможно только для некоммерческого использования!

Подробная инструкция по скачиванию шрифтов в статье «Как скачать шрифт на сайте»

Как установить шрифт Esenin script Two на сайт

Для установки шрифта «Esenin script Two» на сайт необходимо скопировать все файлы шрифта в папку, например, «fonts/esenin-script-two». В файле стилей подключить шрифт, используя конструкцию CSS:

Скопировать в буфер обмена

@font-face {
	font-family: "Esenin script Two";
	src: url("../fonts/esenin-script-two/esenin-script-two.eot"); /* IE9 Compat Modes */
	src: url("../fonts/esenin-script-two/esenin-script-two.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
		url("../fonts/esenin-script-two/esenin-script-two.otf") format("opentype"), /* Open Type Font */
		url("../fonts/esenin-script-two/esenin-script-two.svg") format("svg"), /* Legacy iOS */
		url("../fonts/esenin-script-two/esenin-script-two.ttf") format("truetype"), /* Safari, Android, iOS */
		url("../fonts/esenin-script-two/esenin-script-two.woff") format("woff"), /* Modern Browsers */
		url("../fonts/esenin-script-two/esenin-script-two.woff2") format("woff2"); /* Modern Browsers */
	font-weight: normal;
	font-style: normal;
}

Установить шрифт «Esenin script Two» для требуемого текста, поля, кнопки или другого элемента на сайте:

font-family: "Esenin script Two";

Пример применения шрифта «Esenin script Two»:

body {
	font-family: "Esenin script Two";
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.2;
	color: #000;
	background-color: #fff;
}

Вопросы и задачи по теме

Перед тем как перейти к изучению следующей темы пройдите практические задания:

Для выполнения задания вам понадобится скачать архив и скопировать содержимое архива (два HTML файла) в любую папку на вашем жестком диске:

Переходим на сайт службы Google Fonts и скачиваем необходимые нам шрифты:
для заголовка — Roboto, для остального текста — Open Sans

Обратите внимание, что Вам необходимо будет подключить один шрифт Roboto и три Open Sans к странице. В результате у Вас должно получиться следующее:
Практическое задание № 10.
Переходим на сайт службы Google Fonts, находим необходимый нам шрифт — Ubuntu, выбираем необходимые стили шрифта и языки, которые нам понадобятся

После этого с использованием тега подключите шрифты на нашу страницу. В результате у Вас должно получиться следующее:
Практическое задание № 11.

Если у Вас возникают трудности при подключении шрифтов, Вы всегда можете открыть пример в отдельном окне и проинспектировать страницу примера, чтобы понять какой код CSS был использован.

Каскадность в CSS

Цветовое оформление в CSS

Рейтинг
( Пока оценок нет )
Editor
Editor/ автор статьи

Давно интересуюсь темой. Мне нравится писать о том, в чём разбираюсь.

Понравилась статья? Поделиться с друзьями:
3D-тест
Комментарии: 1
  1. Аватар
    Artur

    Красивый шрифты на fonttextup :!:

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: