Цветовые палитры и шрифты в SharePoint

Статья
03/21/2023

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

[! ВАЖНО! Этот параметр расширяемости доступен только для классических интерфейсов SharePoint. Эту возможность нельзя использовать вместе с современным интерфейсом в SharePoint Online, например на сайтах для общения.

Цветовые палитры

Цветовая палитра — сочетание цветов, использующихся на сайте SharePoint. Она определяется в файле цветовой палитры. Цветовые слоты также используются файлом предварительного просмотра эталонной страницы для создания изображений эскиза и для предварительного просмотра изображений. Ниже описывается структура файла цветовой палитры и предварительного просмотра эталонной страницы:

Файл цветовой палитры (файл SPCOLOR)

Эти файлы используются в мастере изменения оформления, который позволяет пользователям изменять внешний вид сайта с помощью тем пользовательского интерфейса SharePoint. По умолчанию вместе с SharePoint устанавливаются 32 файла цветовой палитры. Кроме того, предусмотрена возможность создания дополнительных файлов. Ниже приводится пример формата файла цветовой палитры.

<s:colorPalette isInverted="InvertedSetting" previewSlot1="Slot1" previewSlot2="Slot2" previewSlot3="Slot3" xmlns:s="http://schemas.microsoft.com/sharepoint/">
    <s:color name="ColorSlot" value="Color" />
    <!--additional color slots-->
</s:colorPalette>

В файле цветовой палитры заменяются следующие заполнители:

InvertedSetting — это логическое значение. Значение true , если цветовая палитра обычно является светлым текстом на темном фоне. значение false , если цветовая палитра обычно является темным текстом на светлом фоне.
Slot1 - имя заметки цветового слота, которое используется в качестве первого блока значка палитры в средстве выбора цветовой палитры при работе с темами.
Slot2 - имя заметки цветового слота, которое используется в качестве второго блока значка палитры в средстве выбора цветовой палитры при работе с темами.
Slot3 - имя заметки цветового слота, которое используется в качестве третьего блока значка палитры в средстве выбора палитры при работе с темами.
ColorSlot - имя заметки определяемого цветового слота, например "НазваниеСайта".
Color - это шестнадцатеричное значение цвета, используемое для указанного цветового слота. Оно может быть представлено в виде 6 (RRGGBB) или 8 цифр (AARRGGBB). Если шестнадцатеричное значение представлено 8 цифрами, первые две цифры обозначают уровень прозрачности цвета в диапазоне 00–FF, что соответствует значениям от 0 до 255. Если оно представлено 6 цифрами, по умолчанию установлен уровень непрозрачности со значением 100 % или FF.

Файлы цветовой палитры расположены в коллекции тем корневого сайта (в папке 15 http:// ИмяСемействаСайтов/_catalogs/theme/15/ семейства веб-сайтов). Чтобы получить доступ к коллекции тем из пользовательского интерфейса SharePoint, в разделе Коллекция веб-дизайнера на странице Параметры сайта выберите элемент Темы, а затем выберите папку 15.

Файл предварительного просмотра эталонной страницы (файл PREVIEW)

Файлы предварительного просмотра эталонной страницы используются для создания эскизов и изображений предварительного просмотра при работе с мастером изменения оформления. Чтобы эталонную страницу можно было использовать в мастере изменения оформления, для нее обязательно создается соответствующий файл предварительного просмотра. Файл предварительного просмотра — это файл со специальным форматированием, в котором есть разделы для цветовой палитры и схемы цветов по умолчанию, а также для CSS и HTML с маркерами. Он использует маркеры строк для получения значений цветовых слотов, имен шрифтов и локализованных строк пользовательского интерфейса. Ниже приведен пример использования цветовых слотов в файле предварительного просмотра эталонной страницы.


[ID] #dgp-pageContainer
{
    background-color: [T_THEME_COLOR_PAGEBACKGROUND];
    color: [T_THEME_COLOR_BODYTEXT];
    width: 100%;
    height:100%;
    background-image: url('[T_IMAGE]');
    background-size: cover;
    font-family: [T_BODY_FONT];
}

Дополнительные сведения см. в разделе Практическое руководство. Создание файла предварительного просмотра главной страницы в SharePoint

Сопоставление цветовых слотов

В таблице 1 описаны доступные цветовые слоты и область их применения на сайтах SharePoint.

Примечание.

При обсуждении элементов навигации нажатие применяется к, когда пользователь щелкает или касается элемента навигации. Выбранный применяется к при переходе пользователя на страницу.> Ниже приводится сводка обычного потока действий и цветового слота, применяемого к ссылке элемента навигации на каждом шаге:> Базовый текст ссылки на элемент навигации: HeaderNavigationText> Пользователь наводит курсор на ссылку элемента навигации: HeaderNavigationHoverText> Пользователь щелкает, касается или выбирает ссылку элемента навигации: HeaderNavigationPressedText> Пользователь переходит на выбранную страницу. Место использования цвета, применяемое к элементу навигации для страницы, которую просматривает пользователь: HeaderNavigationSelectedText.

Таблица 1. Цветовые слоты

Имя заметки	Применение цвета в пользовательском интерфейсе	Имя маркера
BodyText	Обычный текст	[T_THEME_COLOR_BODYTEXT]
SubtleBodyText	Основной текст должен быть светлее, чем обычно. Примером является текст метаданных.	[T_THEME_COLOR_SUBTLEBODYTEXT]
StrongBodyText	Выделение более насыщенным цветом основного текста, который должен отличаться от обычного.	[T_THEME_COLOR_STRONGBODYTEXT]
DisabledText	Отключенный текст. Например, недоступные элементы в меню.	[T_THEME_COLOR_DISABLEDTEXT]
SiteTitle	Цвет текста заголовка.	[T_THEME_COLOR_SITETITLE]
WebPartHeading	Цвет текста для заголовков веб-части.	[T_THEME_COLOR_WEBPARTHEADING]
ErrorText	Основной цвет, который при необходимости используется для текста сообщения об ошибке, границ и фона.	[T_THEME_COLOR_ERRORTEXT]
AccentText	Цвет, который применяется для контрастного основного текста.	[T_THEME_COLOR_ACCENTTEXT]
SearchURL	Цвет URL-адреса в результатах поиска. Он также используется для выделения новых элементов или уведомлений об успешной доставке.	[T_THEME_COLOR_SEARCHURL]
Hyperlink	Цвет текста гиперссылок.	[T_THEME_COLOR_HYPERLINK]
HyperlinkFollowed	Цвет текста просмотренных гиперссылок.	[T_THEME_COLOR_HYPERLINKFOLLOWED]
HyperlinkActive	Цвет гиперссылки при нажатии.	[T_THEME_COLOR_HYPERLINKACTIVE]
CommandLinks	Большие ссылки на команды, которые из-за своего размера должны быть немного светлее основного текста.	[T_THEME_COLOR_COMMANDLINKS]
CommandLinksSecondary	Цвет текста более коротких ссылок на команды, который должен быть насыщеннее, чтобы выделяться на фоне остального текста.	[T_THEME_COLOR_COMMANDLINKSSECONDARY]
CommandLinksHover	Цвет ссылки на команду при наведении на нее курсора мыши.	[T_THEME_COLOR_COMMANDLINKSHOVER]
CommandLinksPressed	Цвет ссылки на команду при нажатии на нее.	[T_THEME_COLOR_COMMANDLINKSPRESSED]
CommandLinksDisabled	Цвет отключенной ссылки на команду.	[T_THEME_COLOR_COMMANDLINKSDISABLED]
BackgroundOverlay	Основной цвет фона, видимый между необязательным фоновым изображением и содержимым страницы.	[T_THEME_COLOR_BACKGROUNDOVERLAY]
DisabledBackground	Фон для отключенных элементов, таких как элементы управления браузером, например поле ввода или поле выбора, за исключением кнопок.	[T_THEME_COLOR_DISABLEDBACKGROUND]
PageBackground	Цвет фона страницы. Отображается за необязательным фоновым изображением.	[T_THEME_COLOR_PAGEBACKGROUND]
HeaderBackground	Цвет фона области верхнего колонтитула страницы.	[T_THEME_COLOR_HEADERBACKGROUND]
FooterBackground	Цвет фона области нижнего колонтитула страницы.	[T_THEME_COLOR_FOOTERBACKGROUND]
SelectionBackground	Цвет фона выбранных элементов списка и пунктов раскрывающегося меню.	[T_THEME_COLOR_SELECTIONBACKGROUND]
HoverBackground	Цвет фона элементов списка и пунктов раскрывающегося меню при наведении на них курсора мыши.	[T_THEME_COLOR_HOVERBACKGROUND]
RowAccent	Контрастная левая граница выбранных элементов списка.	[T_THEME_COLOR_ROWACCENT]
StrongLines	Границы элементов управления браузером при наведении на них курсора мыши.	[T_THEME_COLOR_STRONGLINES]
Lines	Границы элементов управления браузером.	[T_THEME_COLOR_LINES]
SubtleLines	Тонкий цвет границы. Например, линии сетки для встроенного редактирования.	[T_THEME_COLOR_SUBTLELINES]
DisabledLines	Цвет границ для элементов управления браузером, таких как поля ввода и поля выбора.	[T_THEME_COLOR_DISABLEDLINES]
AccentLines	Цвет границы фокуса для выбранных элементов управления браузером.	[T_THEME_COLOR_ACCENTLINES]
DialogBorder	Цвет границы диалогового окна.	[T_THEME_COLOR_DIALOGBORDER]
Навигация	Цвет текста элементов горизонтальной и вертикальной панелей навигации.	[T_THEME_COLOR_NAVIGATION]
NavigationAccent	Цвет текста элемента горизонтальной панели навигации.	[T_THEME_COLOR_NAVIGATIONACCENT]
NavigationHover	Цвет текста панели навигации при наведении на него курсора мыши. Применяется к верхней панели навигации и панели быстрого запуска в горизонтальном режиме.	[T_THEME_COLOR_NAVIGATIONHOVER]
NavigationPressed	Цвет текста элемента панели навигации при его нажатии. Применяется к верхней панели навигации и панели быстрого запуска в горизонтальном режиме.	[T_THEME_COLOR_NAVIGATIONPRESSED]
NavigationHoverBackground	Цвет фона элементов панели быстрого доступа в вертикальном режиме при наведении курсора мыши на элемент панели навигации.	[T_THEME_COLOR_NAVIGATIONHOVERBACKGROUND]
NavigationSelectedBackground	Цвет фона элементов панели быстрого доступа в вертикальном режиме после выбора элемента панели навигации.	[T_THEME_COLOR_NAVIGATIONSELECTEDBACKGROUND]
EmphasisText	Цвет текста, появляющегося поверх акцентного фона.	[T_THEME_COLOR_EMPHASISTEXT]
EmphasisBackground	Контрастный цвет фона, который появляется позади акцентного текста.	[T_THEME_COLOR_EMPHASISBACKGROUND]
EmphasisHoverBackground	Цвет фона при наведении курсора мыши для элементов, расположенных на акцентном фоне.	[T_THEME_COLOR_EMPHASISHOVERBACKGROUND]
EmphasisBorder	Цвет границы элементов, расположенных на акцентном фоне.	[T_THEME_COLOR_EMPHASISBORDER]
EmphasisHoverBorder	Цвет границы при наведении курсора мыши для элементов, расположенных на акцентном фоне.	[T_THEME_COLOR_EMPHASISHOVERBORDER]
SubtleEmphasisText	Текст, который появляется поверх слабо выделенного акцентного фона.	[T_THEME_COLOR_SUBTLEEMPHASISTEXT]
SubtleEmphasisCommandLinks	Цвет ссылки на команду для ссылок, появляющихся поверх слабо выделенного акцентного фона.	[T_THEME_COLOR_SUBTLEEMPHASISCOMMANDLINKS]
SubtleEmphasisBackground	Фон, поверх которого появляется слабо выделенный акцентный текст.	[T_THEME_COLOR_SUBTLEEMPHASISBACKGROUND]
TopBarText	Цвет текста и глифа для приветственного меню, значков панели быстрого доступа и закрытых вкладок на ленте.	[T_THEME_COLOR_TOPBARTEXT]
TopBarBackground	Цвет фона верхней панели, видимой под панелью иерархической навигации или справа от нее.	[T_THEME_COLOR_TOPBARBACKGROUND]
TopBarHoverText	Цвет текста и глифа для приветственного меню, значков панели быстрого доступа и закрытых вкладок на ленте при наведении на них курсора мыши.	[T_THEME_COLOR_TOPBARHOVERTEXT]
TopBarPressedText	Цвет текста и глифа для приветственного меню, значков панели быстрого доступа и закрытых вкладок на ленте при нажатии на них.	[T_THEME_COLOR_TOPBARPRESSEDTEXT]
HeaderText	Цвет основного текста для любого элемента в области верхнего колонтитула.	[T_THEME_COLOR_HEADERTEXT]
HeaderSubtleText	Текст подсказки для поля поиска, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERSUBTLETEXT]
HeaderDisableText	Текст отключенного поля поиска, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERDISABLETEXT]
HeaderNavigationText	Цвет основного текста навигационных ссылок в области верхнего колонтитула.	[T_THEME_COLOR_HEADERNAVIGATIONTEXT]
HeaderNavigationHoverText	Цвет текста навигационных ссылок в области верхнего колонтитула при наведении на них курсора мыши.	[T_THEME_COLOR_HEADERNAVIGATIONHOVERTEXT]
HeaderNavigationPressedText	Цвет текста навигационных ссылок в области верхнего колонтитула при выборе ссылки.	[T_THEME_COLOR_HEADERNAVIGATIONPRESSEDTEXT]
HeaderNavigationSelectedText	Цвет текста навигационных ссылок в области верхнего колонтитула, когда ссылка уже выбрана.	[T_THEME_COLOR_HEADERNAVIGATIONSELECTEDTEXT]
HeaderLines	Линии поля поиска, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERLINES]
HeaderStrongLines	Линии поля поиска, расположенного в области верхнего колонтитула, при наведении курсора мыши.	[T_THEME_COLOR_HEADERSTRONGLINES]
HeaderAccentLines	Линии выделенного поля поиска, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERACCENTLINES]
HeaderSublteLines	Тонкие линии, найденные внутри области заголовка. Не используется в CSS по умолчанию.	[T_THEME_COLOR_HEADERSUBTLELINES]
HeaderDisabledLines	Линии отключенного поля поиска, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERDISABLEDLINES]
HeaderDisabledBackground	Фон отключенного поля поиска, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERDISABLEDBACKGROUND]
HeaderFlyoutBorder	Граница раскрывающегося меню из области верхнего колонтитула.	[T_THEME_COLOR_HEADERFLYOUTBORDER]
HeaderSiteTitle	Цвет текста названия сайта, расположенного в области верхнего колонтитула.	[T_THEME_COLOR_HEADERSITETITLE]
SuiteBarBackground	Цвет фона панели иерархической навигации.	[T_THEME_COLOR_SUITEBARBACKGROUND]
SuiteBarHoverBackground	Цвет фона панели иерархической навигации при наведении курсора мыши.	[T_THEME_COLOR_SUITEBARHOVERBACKGROUND]
SuiteBarText	Цвет текста и глифа для элементов панели иерархической навигации.	[T_THEME_COLOR_SUITEBARTEXT]
SuiteBarDisabledText	Цвет текста и глифа для отключенных элементов набора. Не используется в CSS по умолчанию.	[T_THEME_COLOR_SUITEBARDISABLEDTEXT]
ButtonText	Цвет текста кнопок.	[T_THEME_COLOR_BUTTONTEXT]
ButtonDisabledText	Цвет текста отключенных кнопок.	[T_THEME_COLOR_BUTTONDISABLEDTEXT]
ButtonBackground	Цвет фона кнопок.	[T_THEME_COLOR_BUTTONBACKGROUND]
ButtonHoverBackground	Цвет фона кнопок при наведении курсора мыши.	[T_THEME_COLOR_BUTTONHOVERBACKGROUND]
ButtonPressedBackground	Цвет фона кнопок при нажатии.	[T_THEME_COLOR_BUTTONPRESSEDBACKGROUND]
ButtonDisabledBackground	Цвет фона отключенных кнопок.	[T_THEME_COLOR_BUTTONDISABLEDBACKGROUND]
ButtonBorder	Цвет границы кнопок.	[T_THEME_COLOR_BUTTONBORDER]
ButtonHoverBorder	Цвет границы кнопок при наведении курсора мыши.	[T_THEME_COLOR_BUTTONHOVERBORDER]
ButtonPressedBorder	Цвет границы кнопок при нажатии.	[T_THEME_COLOR_BUTTONPRESSEDBORDER]
ButtonDisabledBorder	Цвет границы отключенных кнопок.	[T_THEME_COLOR_BUTTONDISABLEDBORDER]
ButtonGlyph	Цвет глифа на кнопке.	[T_THEME_COLOR_BUTTONGLYPH]
ButtonGlyphActive	Цвет глифа на кнопке при наведении курсора мыши.	[T_THEME_COLOR_BUTTONGLYPHACTIVE]
ButtonGlyphDisabled	Цвет глифа для неактивной кнопки.	[T_THEME_COLOR_BUTTONGLYPHDISABLED]
TileText	Текст, отображаемый в верхней части наложения фона плитки.	[T_THEME_COLOR_TILETEXT]
TileBackgroundOverlay	Цвет наложения фона плиток.	[T_THEME_COLOR_TILEBACKGROUNDOVERLAY]
ContentAccent1	Первый акцентный цвет, доступный пользователю в средстве выбора цвета (редакторе форматированного текста).	[T_THEME_COLOR_CONTENTACCENT1]
ContentAccent2	Второй акцентный цвет, доступный пользователю в средстве выбора цвета (редакторе форматированного текста).	[T_THEME_COLOR_CONTENTACCENT2]
ContentAccent3	Третий акцентный цвет, доступный пользователю в средстве выбора цвета (редакторе форматированного текста).	[T_THEME_COLOR_CONTENTACCENT3]
ContentAccent4	Четвертый акцентный цвет, доступный пользователю в средстве выбора цвета (редакторе форматированного текста).	[T_THEME_COLOR_CONTENTACCENT4]
ContentAccent5	Пятый акцентный цвет, доступный пользователю в средстве выбора цвета в редакторе форматированного текста.	[T_THEME_COLOR_CONTENTACCENT5]
ContentAccent6	Шестой акцентный цвет, доступный пользователю в средстве выбора цвета (редакторе форматированного текста).	[T_THEME_COLOR_CONTENTACCENT6]

Схемы шрифтов

Шрифты указываются в схеме шрифтов (файле SPFONT) и файле предварительного просмотра эталонной страницы (файле PREVIEW) данного сайта SharePoint. Схема шрифтов определяет шрифты для четырех областей: названия, панели навигации, заголовка и основного текста. SharePoint содержит семь схем шрифтов. Вы также можете создавать дополнительные схемы. Файлы схем шрифтов хранятся во вложенной папке 15 коллекции тем корневого сайта в семействе веб-сайтов (http:// ИмяСемействаСайтов/_catalogs/theme/15/). Чтобы получить доступ к коллекции тем из пользовательского интерфейса SharePoint, в разделе Коллекция веб-дизайнера на странице Параметры сайта щелкните ссылку Темы, а затем выберите папку 15.

Ниже приводится пример формата для файла SPFONT.


<?xml version="1.0" encoding="utf-8"?>
<s:fontScheme name="FontSchemeName" previewSlot1="Slot1" previewSlot2="Slot2" xmlns:s="http://schemas.microsoft.com/sharepoint/">
  <s:fontSlots>
    <s:fontSlot name="FontSlotName">
      <s:latin typeface="LatinScriptFont" />
      <s:ea typeface="EAScriptFont"/>
      <s:cs typeface="CSFont" />
      <s:font script="Language" typeface="ScriptFont" />
      <!--Additional fonts-->
  </s:fontSlots>
  <!--Additional font slots-->
</s:fontScheme>

В файле SPFONT заменяются следующие заполнители:

FontSchemeName - имя схемы шрифтов.
Slot1 - имя слота шрифта, который используется в качестве первого блока значка шрифта в средстве выбора схемы шрифтов, доступном в мастере изменения оформления.
Slot2 - имя слота шрифта, который используется в качестве второго блока значка шрифта в средстве выбора схемы шрифтов, доступном в мастере изменения оформления.
FontSlotName - имя определяемого слота шрифта, например название.
LatinScriptFont — шрифт, используемый для латинского письма. Он также выступает в качестве резервного, т. е. применяется для языков, для которых не установлен определенный шрифт в схеме шрифтов.

Примечание.

Вам необходимо указать дополнительные сведения для использования веб-шрифтов в шрифтовой схеме. Подробнее об этом можно узнать в разделе Веб-шрифты этой статьи.
EAScriptFont — это шрифт, используемый для сценариев Восточной Азии. Элемент <s:ea> в настоящее время не используется SharePoint. Но элемент s:ea> по-прежнему< является обязательным в схеме шрифта.
CSFont — это шрифт, используемый для сложных скриптов. Элемент <s:cs> в настоящее время не используется SharePoint. Но элемент s:cs> по-прежнему< является обязательным в схеме шрифтов.
Language - это набор знаков.
ScriptFont - это шрифт, который используется для определенного набора знаков.

Ниже приводится пример части файла SPFONT.


<s:fontScheme name="Georgia" previewSlot1="title" previewSlot2="body" xmlns:s="http://schemas.microsoft.com/sharepoint/">
    <s:fontSlots>
        <s:fontSlot name="title">
            <s:latin typeface="Georgia"/>
            <s:ea typeface=""/>
            <s:cs typeface="Segoe UI Light" />
            <s:font script="Arab" typeface="Tahoma" />
            <s:font script="Deva" typeface="Mangal" />
            <s:font script="Grek" typeface="Segoe UI Light" />
            <s:font script="Hang" typeface="Malgun Gothic" />
            <s:font script="Hans" typeface="Microsoft YaHei" />
            <s:font script="Hant" typeface="Microsoft JhengHei" />
            <s:font script="Hebr" typeface="Tahoma" />
            <s:font script="Hira" typeface="Meiryo" />
            <s:font script="Thai" typeface="Tahoma" />
            <s:font script="Armn" typeface="Tahoma" />
            <s:font script="Beng" typeface="Vrinda" />
            <s:font script="Cher" typeface="Plantagenet Cherokee" />
            <s:font script="Ethi" typeface="Nyala" />
            <s:font script="Geor" typeface="Sylfaen" />
            <s:font script="Gujr" typeface="Shruti" />
            <s:font script="Guru" typeface="Raavi" />
            <s:font script="Knda" typeface="Tunga" />
            <s:font script="Khmr" typeface="DaunPenh" />
            <s:font script="Laoo" typeface="DokChampa" />
            <s:font script="Mlym" typeface="Kartika" />
            <s:font script="Mymr" typeface="Myanmar Text" />
            <s:font script="Orya" typeface="Kalinga" />
            <s:font script="Sinh" typeface="Iskoola Pota" />
            <s:font script="Syrc" typeface="Estrangelo Edessa" />
            <s:font script="Taml" typeface="Latha" />
            <s:font script="Telu" typeface="Gautami" />
            <s:font script="Thaa" typeface="MV Boli" />
            <s:font script="Tibt" typeface="Cordia New" />
            <s:font script="Yiii" typeface="Microsoft Yi Baiti" />
        </s:fontSlot>
???

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

Шрифты, соответствующие веб-палитре

Шрифты, соответствующие веб-палитре, представляют собой набор широко используемых шрифтов, которые по умолчанию доступны на большинстве устройств. Чтобы указать шрифт, соответствующий веб-палитре, в схеме шрифтов, включите его имя в атрибут typeface слота шрифта. Ниже приводится пример использования шрифта, соответствующего веб-палитре, в схеме шрифтов.


<s:fontSlot name="title">
  <s:latin typeface="Georgia"/>
???
</s:fontSlot>

Веб-шрифты

Веб-шрифты — это шрифты, доступные в Интернете. Когда пользователь просматривает сайт, на котором используются веб-шрифты, веб-браузер скачивает необходимые файлы шрифтов вместе со всей страницей. Чтобы использовать веб-шрифт, необходимо указать URL-адрес ваших файлов шрифтов в четырех форматах (для обеспечения поддержки различными браузерами), а также маленький и большой эскизы, которые используются средством выбора схем шрифтов для определения имен шрифтов.

В следующем примере описываются сведения, необходимые для использования веб-шрифта в элементе <s:latin> .


<s:latin typeface="FontName"
  eotsrc="EotFile"
  woffsrc="WoffFile"
  ttfsrc="TtfFile"
  svgsrc="SvgFile"
  largeimgsrc="LargeImgFile"
  smallimgsrc="SmallImgFile" />

В этом примере использования веб-шрифта заменяются следующие заполнители:

FontName - имя веб-шрифта.
EotFile - относительный URL-адрес файла внедряемых шрифтов Open Type.
WoffFile - относительный URL-адрес файла шрифта WOFF (Web Open Font Format).
TtfFile - относительный URL-адрес файла шрифта TrueType.
SvgFile - относительный URL-адрес файла шрифта для масштабируемого векторного рисунка (SVG).
LargeImgFile - относительный URL-адрес большого эскиза, используемого в средстве выбора схемы шрифтов.
SmallImgFile - относительный URL-адрес маленького эскиза, используемый в средстве выбора схемы шрифтов.

Примечание.

Пути к файлам должны быть в формате полного URL-адреса (то есть https://tenant.sharepoint.com/sites/sitename/_catalogs/theme/15/fontfile.wof). Атрибуты LargeImgFile и SmallImgFile должны указываться в теге Latin, даже если им присвоены пустые значения.

Слоты шрифтов

В таблице 1 представлены доступные слоты шрифтов, а также области их применения на странице.

Таблица 1. Слоты шрифтов

Имя слота шрифта	Описание
title	Используется в названии страницы.
перемещение	Используется для элементов горизонтальной и вертикальной панели навигации на странице.
large-heading	Используется в заголовках H1.
heading	Используется для заголовков H2 и H3, названий веб-частей, диалоговых окон и выносок.
small-heading	Используется для заголовков H4.
large-body	Используется для крупного основного текста размером 15 и 19 пикселей.
body	Основной шрифт, который используется для остального текста на странице.

Поделиться через