Главная » 3D-моделирование

Шрифт arial

На чтение: 8 мин 3D-моделирование

Как установить шрифт Barocco Initial на сайт

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

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

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

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

font-family: "Barocco Initial";

Пример применения шрифта «Barocco Initial»:

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

Информация о шрифте Barocco Initial

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

Barocco Initial Regular 400

Семейство

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

Regular (Обычный)

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

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

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

Version 0.000 2009 initial release

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

GophmannAL: Barocco Initial: 2009

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

BaroccoInitial

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

Copyright (c) Gophmann AL , 2009. All rights reserved.

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

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

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

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

Категории шрифта Barocco Initial

Бесплатные шрифты, Винтажные шрифты, Декоративные шрифты, Кириллические шрифты, Латинские шрифты, Русские шрифты, Художественные шрифты

Предварительный просмотр Barocco Initial

Шрифт Barocco Initial с поддержкой латиницы

Предварительный просмотр шрифта «Barocco Initial» с прописными латинскими буквами (английский алфавит A-Z).

Шрифт Barocco Initial с поддержкой кириллицы

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

Шрифт Barocco Initial с поддержкой цифр

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

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

Предварительный просмотр шрифта «Barocco Initial» со знаками препинания и пунктуации (, . ? ; ‘ : » ! # $ % & * ( ) — +).

Скачать шрифт Barocco Initial

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

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

Как установить шрифт Barocco Initial на сайт

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

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

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

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

font-family: "Barocco Initial";

Пример применения шрифта «Barocco Initial»:

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

А если без кириллицы?

Для англоязычных текстов вышеприведенные таблицы имеют несколько другой вид.

Windows Mac OS Unix/Linux Родовое семейство
Arial Black Gadget Nimbus Sans L Sans-serif
Arial Helvetica Nimbus Sans L Sans-serif
Comic Sans MS Monaco TSCu_Comic cursive
Courier New Courier Nimbus Mono L Monospace
Georgia * (см. ниже) Century Schoolbook L Serif
Impact Charcoal Rekha Sans-serif
Times New Roman Times Nimbus Roman No9 L Serif
Trebuchet MS Helvetica Garuda Sans-serif
Verdana Geneva DejaVu Sans Sans-serif

Для шрифтов Arial, Courier New и Times New Roman при составлении линеек лучше указывать сначала шрифт для Unix/Linux, а затем для Mac OS. Это связанно с некоторой кривостью набора Linux шрифтов X11 core fonts set.

Шрифты, которые не входят в перечень «безопасных», но могут использоваться на макетах, лучше определять шрифтовыми CSS стеками на основе этой таблицы.

Windows Mac OS Unix/Linux Родовое семейство
Lucida Console Monaco — Monospace
Lucida Sans Unicode Lucida Grande Garuda Sans-serif
Palatino Linotype Palatino Garuda** Sans-serif
Tahoma Geneva Kalimati Sans-serif

Прочерк в графе Unix/Linux обозначает, что пользователи этих ОС скорее всего увидят на странице шрифт, установленный для отображения страниц по умолчанию.

** В данной линейке шрифт Garuda имеет смысл ставить перед Palatino (см. пояснение выше).

Шрифты поддерживающие кириллицу

Специфической особенностью рунета является проблема с кодировками страниц и поддержкой кириллицы в шрифтах. Чтобы не возникало проблем с разнообразными кодировками символов, умные люди придумали Unicode, который позволяет сочетать в одном шрифте символы нескольких языков. Таким образом для русскоязычных страниц нужно использовать только Unicode шрифты поддерживающие кириллицу.

Ниже приведена таблица соответствий шрифтов.

Windows Mac OS Unix/Linux Родовое семейство
Arial Black Helvetica CY Nimbus Sans L Sans-serif
Arial Helvetica CY Nimbus Sans L Sans-serif
Comic Sans MS Monaco CY * (см. ниже) cursive
Courier New * (см. ниже) Nimbus Mono L Monospace
Georgia * (см. ниже) Century Schoolbook L Serif
Impact Charcoal CY * (см. ниже) Sans-serif
Times New Roman Times CY Nimbus Roman No9 L Serif
Trebuchet MS Helvetica CY * (см. ниже) Sans-serif
Verdana Geneva CY DejaVu Sans Sans-serif

* в колонке напротив шрифта означает, что родных кириллических эквивалентов Windows шрифта у операционной системы не имеется. Но в то же время есть большая вероятность, что в операционной системе установлен непосредственно сам этот шрифт.

Например, если основным текстом макета является Arial, находим в табличке этот шрифт и в CSS пишем соответствующую ему строчку:

body {
font-family: Arial, «Helvetica CY», «Nimbus Sans L», sans-serif;
}

1
2
3

body{

font-familyArial,»Helvetica CY»,»Nimbus Sans L»,sans-serif;

}

Эта запись означает, что если у пользователя есть шрифт Arial (а он есть у всех пользователей Windows и всех пользователи Mac OS X), то страница отобразися этим шрифтом. Если же у пользователя нет этого шрифта, то страничка русскоязычного пользователя Mac OS 9 точно отобразится стандартным системным шрифтом Helvetica CY, а у пользователя Unix/Linux отобразися шрифтом Nimbus Sans L который установлен у 90% пользователей Unix/Linux. Если же пользователь Unix/Linux принадлежит в тем 10%, у которых нет этого шрифта, то страница отобразится тем шрифтом с засечками, который установлен для просмотра Web-страниц по умолчанию.

Кроме того, что в таблице учитываются шрифты Unix/Linux, там еще после обычного Helvetica идет какой-то странный значок CY. Давайте разбираться, что же это такое!

До выхода Mac OS X эта линейка имела следующее значение: для пользователей Windows отображаем страницу Arial, для пользователей Mac OS 9 — стандартным шрифтом Helvetica, а остальные видят страницу с системным шрифтом без засечек, настроенным по умолчанию в браузере. Но опять же немаловажный нюанс! У стандартного Mac OS 9 шрифта Helvetica нет кириллицы! Для русскоязычной страницы это означало следующее: для пользователей Windows отображаем страницу Arial, для пользователей Mac OS 9 — стандартным шрифтом Helvetica, который выводит нечитаемую информацию, а остальные видят страницу с системным шрифтом без засечек, настроенным по умолчанию в браузере.

Для правильного отображения этого набора у пользователей Mac OS 9 вместо некириллизированной Helvetica, имеет смысл указывать такой же стандартный для Mac OS 9 шрифт Helvetica CY, содержащий кириллицу.

Прочтение линеек после выхода Mac OS X изменилось. Теперь для Windows/Mac OS X указывается один общий стандартный шрифт. А если мы хотим, чтобы замысел дизайнера смогли увидеть пользователи Mac OS 9, для них нужно в линейке шрифтов прописать шрифт содержащий кириллицу.

Таким образом хотя и не существует безопасных шрифтов, существуют безопасные линейки шрифтов. Их еще называют шрифтовыми CSS стеками. В эти линейки помимо стандартных шрифтов Windows/Mac OS X можно включать также эквивалентные шрифты из стандартного набора Mac OS 9 (которая не содержит по умолчанию «безопасных» шрифтов) и распространенных шрифтов Unix/Linux.

Любой верстальщик рано или поздно сталкивается с моментом, когда дизайнер использует в макете шрифт, не входящий в перечень «безопасных»;. Но это еще не повод бить тревогу! Например, дизайнеры очень часто используют на макетах шрифт Tahoma, который не входит в этот перечень. Правильно построенная линейка шрифтов открывает возможность использовать не только Tahoma, но и другие шрифты. Все большее количество дизайнеров пользуются этой возможностью и грамотный верстальщик должен об этом знать.

Ниже приведена дополнительная таблица шрифтов, которые не входят в перечень «безопасных», но могут использоваться на макетах.

Windows Mac OS Родовое семейство
Lucida Console Monaco Monospace
Lucida Sans Unicode Lucida Grande Sans-serif
Tahoma Geneva CY Sans-serif
Рейтинг
( Пока оценок нет )
Editor
Editor/ автор статьи

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

Понравилась статья? Поделиться с друзьями:
3D-тест
Вам также может быть интересно
.
10 лучших бесплатных кириллических шрифтов с google fonts
3D-моделирование 0
Шрифт arial narrow
Шрифт Arial Narrow, относится к категориям Семейство Sans шрифтов, Уплотненные шрифты, Стандартные шрифты и
3D-тест
Как добавить шрифт в figma с компьютера и в браузере за 2 минуты
3D-моделирование 0
Amatic bold
3D-тест
Безопасные шрифты. verdana, arial, arial black, comic sans ms, courier new, georgia, impact, times new roman, trebuchet ms. верстальщику о шрифтах. | html/css
3D-моделирование 0
Advergothic italic
3D-тест
Определить шрифт по картинке онлайн
3D-моделирование 0
30+ красивых шрифтов для word (+как установить шрифты)
Подборка 30+ красивых шрифтов для Ворда. Скачать рукописные русские шрифты можно бесплатно + в
3D-тест
Добавить комментарий

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

Этот сайт использует cookie для хранения данных. Продолжая использовать сайт, Вы даете свое согласие на работу с этими файлами и принимаете условия пользовательского соглашения.