Как в html задать стиль текста: Как сделать красивый шрифт в html: размеры, цвета, теги шрифтов html

html — Как в верстке использовать два стиля одного шрифта?

Я новичок, и во время верстки столкнулся проблемой. Нужно сверстать страницу со 100% точностью с макетом. Но есть проблема. Нужно использовать два разных стиля одного шрифта в тексте и заголовке. В html через link обьявить оба стиля легко, но в css поставить в нужную часть нужный стиль невозможно. Пример: нужно использовать шрифт lato со стилями regular и light. В html будет так:

<link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'> <link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;1,300&display=swap" rel="stylesheet">

С этим понятно. Но в css коде стиль не указывается, и код будет таким:

h2 {
  font-family: 'Lato', sans-serif;
  font-weight: bold;
}

Тут используется тот стиль, который был обьявлен первее в html.

  • html
  • css
  • вёрстка
  • шрифты

1

Как вариант. Или нет?

* {
  font-family: 'Lato', sans-serif;
}

h2 {
  font-weight: bold;
}

.ital {
  font-style: italic;
}

.wght {
  font-weight: bold;
}
<link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;1,300&display=swap" rel="stylesheet">
<h2>Заголовок</h2>
<h3>Заголовок</h3>
<p>Текст Текст Текст Текст Текст Текст</p>
<p>Текст Текст Текст Текст Текст Текст</p>
<p>Текст Текст Текст Текст Текст Текст</p>
<p>Текст Текст Текст Текст Текст Текст</p>

Зарегистрируйтесь или войдите

Регистрация через Google

Регистрация через Facebook

Регистрация через почту

Отправить без регистрации

Почта

Необходима, но никому не показывается

Отправить без регистрации

Почта

Необходима, но никому не показывается

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

Параметры шрифта и фона | Контейнеры

Начнем изучение возможностей языка CSS.

Сначала рассмотрим атрибуты стилей, задающие параметры шрифта и фона элементов Web-страниц. Затем мы изучим новый элемент Web-страницы — встроенный контейнер — и соответствующий ему HTML-тег, который нам в дальнейшем весьма пригодится.

Заметим сразу, что все атрибуты стиля, описанные в этой главе, применимы к любым элементам Web-страниц — и блочным, и встроенным. Есть, правда, одно исключение, о котором мы предупредим особо.

Начнем с атрибутов стиля, задающих параметры шрифта, которым набран текст. Ведь текст на Web-страницах — всему голова.

Атрибут стиля font-family задает имя шрифта, которым будет выведен текст:

font-family: <список имен шрифтов, разделенных запятыми>|inherit

Имена шрифтов задаются в виде их названий, например, Arial или Times New Roman. Если имя шрифта содержит пробелы, его нужно взять в кавычки:

P { font-family: Arial }
h2 ( font-family: «Times New Roman» }

Если данный атрибут стиля присутствует во встроенном стиле, кавычки заменяют апострофами:

<P>

Если указанный нами шрифт присутствует на компьютере посетителя, Web-обозреватель его использует. Если же такого шрифта нет, то текст выводится шрифтом, заданным в настройках по умолчанию. И наша Web-страница, возможно,будет выглядеть не так, как мы задумывали. (Впрочем, шрифты Arial и Times New Roman присутствуют на любом компьютере, работающем под управлением Windows.)

Можно указать несколько наименований шрифтов через запятую:

P { font-family: Verdana, Arial }

Тогда Web-обозреватель сначала будет искать первый из указанных шрифтов, в случае неудачного поиска — второй, потом третий и т. д.

Вместо имени конкретного шрифта можно задать имя одного из семейств шрифтов, представляющих целые наборы аналогичных шрифтов. Таких семейств пять: serif (шрифты с засечками), sans-serif (шрифты без засечек), cursive (шрифты, имитирующие рукописный текст), fantasy (декоративные шрифты) и monospace (моноширинные шрифты):

h3 { font-family: Verdana, Arial, sans-serif }

Особое значение inherit указывает, что текст данного элемента Web-страницы должен быть набран тем же шрифтом, что и текст родительского элемента. Говорят, что в данном случае элемент Web-страницы «наследует» шрифт от родительского элемента. Это, кстати, значение атрибута стиля font-family по умолчанию.

Атрибут стиля font-size определяет размер шрифта:

font-size: <размер>|xx-small|x-small|small|medium|large|x-large|

-xx-large|larger|smaller|inherit

Размер шрифта можно задать в абсолютных и относительных величинах. Для этого используется одна из единиц измерения, поддерживаемая CSS (табл. 8.1).

Обозначение выбранной единицы измерения указывают после самого значения:

P { font-size: 10pt }
STRONG { font-size: 1cm }
EM { font-size: 150% }

Отметим, что все приведенные в табл. 8.1 единицы измерения подходят для задания значений других атрибутов стилей CSS.

Кроме числовых, атрибут font-size может принимать и символьные значения. Так, значения от xx-small до xx-large задают семь предопределенных размеров шрифта, от самого маленького до самого большого. А значения larger и smaller представляют следующий размер шрифта, соответственно, по возрастанию и убыванию. Например, если для родительского элемента определен шрифт размера medium, то значение larger установит для текущего элемента размер шрифта large.

Значение inherit указывает, что данный элемент Web-страницы должен иметь тот же размер шрифта, что и родительский элемент. Это значение атрибута стиля fontsize по умолчанию.

Атрибут стиля color задает цвет текста:

color: <цвет>|inherit

Ранее мы упоминали, что цвет можно задать так называемым RGB-кодом (Red, Green, Blue — красный, зеленый, синий). Он записывается в формате

#<доля красного цвета><доля зеленого цвета><доля синего цвета>,

где доли всех цветов указаны в виде шестнадцатеричных чисел от 00 до FF.

Зададим для текста красный цвет:

h2 { color: #FF0000 }

А теперь серый цвет:

ADDRESS { color: #CCCCCC }

Кроме того, CSS позволяет задавать цвета по именам.

Так, значение black соответствует черному цвету, white — белому, red — красному, green — зеленому, а blue — синему.

Пример:

h2 { color: red }

Полный список имен и соответствующих им цветов можно посмотреть на Web-странице http://msdn.microsoft.com/en-us/library/aa358802%28v=VS.85%29.aspx.

Значение inherit указывает, что данный элемент Web-страницы должен иметь тот же цвет шрифта, что и родительский элемент. Это значение атрибута стиля fontsize по умолчанию.

ВНИМАНИЕ!

Значение inherit поддерживают практически все атрибуты стиля CSS. Оно говорит Web-обозревателю, что элемент Web-страницы, к которому привязан стиль, «наследует» значение соответствующего параметра у родительского элемента. У всех атрибутов это значение по умолчанию. В дальнейшем мы не будем описывать данное значение у каждого атрибута стиля; если же какой-то атрибут стиля не поддерживает его, мы специально об этом упомянем.

С помощью атрибута стиля color мы можем, например, задать цвет горизонтальной линии HTML.

Атрибут стиля opacity позволяет указать степень полупрозрачности элемента Web-страницы:

opacity: <числовое значение>|inherit

Значение полупрозрачности представляет собой число от 0 до 1. При этом 0 обозначает полную прозрачность элемента (т. е. элемент фактически не виден), а 1 — полную непрозрачность (это обычное поведение).

Вот пример задания половинной прозрачности (значение 0,5) для текста фиксированного форматирования:

PRE { opacity: 0.5 }

Отметим, как мы указали дробное число — вместо символа запятой здесь используется точка.

НА ЗАМЕТКУ

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

Атрибут стиля font-weight устанавливает «жирность» шрифта:

font-weight: normal|bold|bolder|lighter|100|200|300|400|500|600|
-700|800|900|inherit

Здесь доступны семь абсолютных значений от 100 до 900, представляющих различную «жирность» шрифта, от минимальной до максимальной; при этом обычный шрифт будет иметь «жирность» 400 (или normal), а полужирный — 700 (или bold). Значение по умолчанию — 400 (normal). Значения bolder и lighter являются относительными и представляют следующие степени «жирности» соответственно в б?льшую и меньшую сторону.

Пример:

CODE { font-weight: bold }

Атрибут font-style задает начертание шрифта:

font-style: normal|italic|oblique|inherit

Доступны три значения, представляющие обычный шрифт (normal), курсив (italic) и особое декоративное начертание, похожее на курсив (oblique).

Атрибут стиля text-decoration задает «украшение» (подчеркивание или зачеркивание), которое будет применено к тексту:

text-decoration: none|underline|overline|line-through|blink|inherit

Здесь доступны пять значений (не считая inherit):

— none убирает все «украшения», заданные для шрифта родительского элемента;

— underline подчеркивает текст;

— overline «надчеркивает» текст, т. е. проводит линию над строками;

— line-through зачеркивает текст;

— blink делает шрифт мерцающим (на данный момент не поддерживается Safari).

ВНИМАНИЕ!

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

Атрибут стиля font-variant позволяет указать, как будут выглядеть строчные буквы шрифта:

font-variant: normal|small-caps|inherit

Значение small-caps задает такое поведение шрифта, когда его строчные буквы выглядят точно так же, как прописные, просто имеют меньший размер. Значение normal задает для шрифта обычные прописные буквы.

Атрибут стиля text-transform позволяет изменить регистр символов текста:

text-transform: capitalize|uppercase|lowercase|none|inherit

Мы можем преобразовать текст к верхнему (значение uppercase этого атрибута) или нижнему (lowercase) регистру, преобразовать к верхнему регистру первую букву каждого слова (capitalize) или оставить в изначальном виде (none).

Атрибут стиля line-height задает высоту строки текста:

line-height: normal|<расстояние>|inherit

Здесь можно задать абсолютную и относительную величину расстояния, указав соответствующую единицу измерения CSS (см. табл. 8.1). При ее отсутствии заданное нами значение сначала умножается на высоту текущего шрифта и затем используется. Таким образом, чтобы увеличить высоту строки вдвое по сравнению с обычной, мы можем написать:

P { line-height: 2 }

Значение normal этого атрибута возвращает управление высотой строки Web-обозревателю.

Атрибут стиля letter-spacing позволяет задать дополнительное расстояние между символами текста:

letter-spacing: normal|<расстояние>

Отметим, что это именно дополнительное расстояние; оно будет добавлено к изначальному, установленному самим Web-обозревателем.

Здесь также можно задать абсолютное и относительное расстояние, указав соответствующую единицу измерения CSS (см. табл. 8.1). Расстояние может быть положительным и отрицательным; в последнем случае символы шрифта будут располагаться друг к другу ближе обычного. Значение normal устанавливает дополнительное расстояние по умолчанию, равное нулю.

Атрибут стиля letter-spacing не поддерживает значение inherit.

Вот пример задания дополнительного расстояния между символами равного пяти пикселам:

h2 { letter-spacing: 5px }

Текст, набранный такими символами, будет выглядеть разреженным.

А здесь мы задали отрицательное дополнительное расстояние между символами равным двум пикселам:

H6 { letter-spacing: -2px }

Эти два пиксела будут вычтены из изначального расстояния, в результате символы сблизятся, а текст станет выглядеть сжатым. Возможно, символы даже налезут друг на друга.

Аналогичный атрибут стиля word-spacing задает дополнительное расстояние между отдельными словами текста:

word-spacing: normal|<расстояние>

Пример:

h2 { word-spacing: 5mm }

Ну, 5 мм, пожалуй, многовато. .. Хотя это всего лишь пример.

И напоследок рассмотрим атрибут стиля font, позволяющий задать одновременно сразу несколько параметров шрифта:

font: [<начертание>] [<вид строчных букв>] [<«жирность»>]

[<размер>[/<высота строки текста>]] <имя шрифта>

Как видим, обязательным является только имя шрифта — остальные параметры могут отсутствовать.

Задаем для текста абзацев шрифт Times New Roman размером 10 пунктов:

P { font: 10pt «Times New Roman» }

А для заголовков шестого уровня — шрифт Arial размером 12 пунктов и курсивного начертания:

H6 { font: italic 12pt Verdana }

4.5. Теги физического стиля — HTML и XHTML: Полное руководство, 6-е издание [Книга]

Текущие стандарты HTML и XHTML в настоящее время обеспечивают девять физические стили: полужирный, курсив, моноширинный, подчеркнутый, зачеркнутый, больший, меньший, надстрочный и подстрочный текст. К нашему большому облегчение, Internet Explorer перестал поддерживать десятый физический стиль, «мигающий» текст. Мы хотим, чтобы другие «получили это». Весь физический стиль теги требуют закрывающих тегов.

При подробном обсуждении физических тегов помните, что они передать острый стиль для непосредственного текста. Для более полного, управление отображением текста на уровне документа, используйте таблицы стилей (см. главу 8).

Тег

Тег физический эквивалент тега стиля , основанного на содержимом, но без расширенного значения последнего. Тег явно выделяет жирным шрифтом символ или сегмент текста, заключенный между ним и его соответствующий конечный тег ( ). Если полужирный шрифт недоступен, браузер может использовать какой-либо другой представление, такое как перевернутое видео или подчеркивание.

Тег

Тег позволяет легко увеличить размер текста. Проще и быть не может: браузер рендерит текст между тегом и его соответствующий закрывающий тег на один размер шрифта больше, чем окружающий текст. Если этот текст уже в самом большом размере, не действует. [, 4.10.3]

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

Тег

(устаревшее расширение)

Текст, содержащийся между тегом и его конечным тегом , делает именно это: он мигает. и выкл. Firefox, например, просто и многократно переворачивает цвета фона и переднего плана для -заключенный текст. Ни Ни HTML, ни стандарт XHTML не включают . Изначально поддерживался как расширение только для версий Netscape Navigator до версии 6; затем он был удален в версии 6 и восстановлен в версиях 7 и позже. Opera и Firefox также поддерживают его — только Internet Explorer. избегает этого. Вы тоже должны.

Мы не можем эффективно воспроизвести анимированный эффект в этих статические страницы, но это легко представить и лучше оставить на усмотрение воображение тоже. Мигающий текст имеет два основных эффекта: внимание читателей, а затем быстро раздражает их до бесконечности. Забывать о мигающем тексте.

Тег

Тег как на основе контента тег стиля. Он и его обязательный конечный тег ( ) сообщают браузеру, что нужно отображать вложенный текст курсивом или наклонным шрифтом. Если шрифт недоступен для браузера, выделение, перевернутое видео или подчеркивание могут использовал.

Тег

(устаревший)

Тег сокращенная форма тега , поддерживаемая всеми текущими браузерами, даже если это устарело в HTML 4 и XHTML. Другими словами, «с» означает застенчивый: не используйте его; будет уходи, в конце концов.

Тег

Тег работает так же, как его <большой> аналог (см. [The Tag, 4.5.2]), за исключением того, что он уменьшает размер текста, а не увеличивает его. Если вложенный текст уже в наименьшем размере, поддерживаемом моделью шрифта, <маленький> не действует.

Как можно с , вы можете вложить тегов в последовательно уменьшать текст. Каждый тег делает текст одного размера меньше, чем содержащий тег , до предела размера 1.

Тег

(устаревший)

Популярные браузеры перечеркивают текст («перечеркивают») который появляется внутри тег и его закрывающий тег . Предположительно, это разметка редактирования, которая говорит читателю игнорировать отрывок текста, напоминает дни до исправления ленты для пишущей машинки. Вы будете редко, если вообще когда-либо, увидеть тег, используемый сегодня: он устарел в HTML 4 и XHTML, всего в одном шаге от полного исключения из стандарт.

Тег

Текст, содержащийся между 9Тег 0011 и его закрывающий тег отображаются на половине высота символа ниже, но с тем же шрифтом и размером, что и текущий текстовый поток. И , и его аналоги полезны для математических уравнений и в научной записи, а также с химические формулы.

Тег

Тег и его Верхний индекс конечного тега вложенный текст; он отображается на пол-символа выше, но с тем же шрифтом и размером, что и текущий поток текста. Этот тег полезно для добавления сносок к вашим документам, наряду с экспоненциальным значения в уравнениях. Когда вы используете его в сочетании с тегом , вы можете создавать красивые, сноски с гиперссылками:

 Личинка quat
долгоносик74 — это
 

В этом примере предполагается, что footnotes.html содержит все ваши сноски, должным образом разделены как именованные фрагменты документа.

Тег

Подобно и Теги , тег и необходимый закрывающий тег направляют браузер на отображать вложенный текст моноширинным шрифтом. Для тех браузеров которые уже используют моноширинный шрифт, этот тег может не иметь значения. заметные изменения в представлении текста.

Тег

(устаревший)

Этот тег сообщает браузеру, что текст следует подчеркивать. содержится между и соответствующий тег . Техника подчеркивания упрощена, рисование линии под пробелами и пунктуации, и текста. Этот тег устарел в HTML 4. и XHTML, но популярные браузеры его поддерживают.

Те же эффекты отображения для 9Тег 0012 лучше достигается с помощью таблицы стилей, описанные в главе 8.

Атрибуты dir и lang

Атрибут dir позволяет сообщить браузеру, в каком направлении текст внутри физического тега должно отображаться, а lang позволяет вы указываете язык, используемый в теге. [Атрибут dir, 3.6.1.1] [Язык атрибут, 3. 6.1.2]

Класс, стиль, идентификатор и заголовок Атрибуты

Хотя каждый физический тег имеет определенный стиль, вы можете переопределить его. этот стиль, определив свой собственный внешний вид для каждого тега. Вы можете применить это новый взгляд на физические теги с использованием либо атрибута стиля , либо атрибута класса . [Встроенные стили: атрибут стиля, 8.1.1] [Классы стилей, 8.3]

Вы также можете назначить уникальный идентификатор тегу физического стиля, как а также менее строгое название с использованием соответствующего атрибута и сопровождающее строковое значение, заключенное в кавычки. [Атрибут id, 4.1.1.4] [Атрибут title, 4.1.1.5]

Атрибуты событий

Как и в случае тегов стиля на основе содержимого, события клавиатуры могут происходить внутри тега физического стиля и вокруг него. содержание. Браузер распознает многие из этих событий, если он соответствует к текущим стандартам, и с соответствующим атрибутом и значением на , вы можете реагировать на событие, отображая диалоговое окно пользователя или активируя некоторые мультимедийные событие. [Событие JavaScript Обработчики, 12.3.3]

Сводка тегов физического стиля

Различные графические браузеры отображают текст внутри физического теги стилей аналогичным образом. Таблица 4-2 суммирует эти стили отображения браузеров для этих тегов. Определения таблиц стилей могут переопределить эти собственные стили отображения.

Таблица 4-2. Теги физического стиля

Тег

Значение

Display style

Bold contents

Bold

Increased font size

Bigger text

<мигает> (устарело)

Чередование переднего и заднего плана цвета

Мигающий текст

Курсив

Курсив

<Маленький>

Уменьшенный размер шрифта

Меньший текст

, 1111111111111111119

. (устарело)

Зачеркнутый текст

Забастовка

Подстрочный текст

sub script

Надстрочный текст

sup erscript

Стиль телетайпа

моноширинный

<у> (устарело)

Подчеркнутое содержимое

Подчеркнутое

Следующий пример исходного кода HTML иллюстрирует некоторые из различные физические теги, отображаемые Firefox (см. рис. 4-12):

 Явно выделены жирным шрифтом, выделены курсивом или
Следует использовать текст в стиле телетайпа
экономно.
В противном случае пейте много 1x106
капли H2O. 
 

Рис. 4-12. Используйте теги физического текста с осторожностью

Разрешенный контент

Любой тег физического стиля может содержать любой элемент, разрешенный в тексте, включая обычный текст, якоря, изображения и разрывы строк. Ты можешь также комбинируйте теги физического стиля с другими тегами на основе содержимого.

Разрешенное использование

Вы можете использовать любой тег физического стиля везде, где вы можете использовать элемент допускается в тексте. В общем, это означает, что где-нибудь в документе, кроме <заголовок> ,

и </code> теги. Вы можете использовать физ. тег стиля в заголовке, но браузер, вероятно, переопределит его и игнорировать его эффект вместо тега заголовка.</p><p><h3><span class="ez-toc-section" id="i-21"> Комбинирование физических стилей </span></h3></p><p> Вероятно, вам больше повезет с сочетанием физических теги, чем если бы вы комбинировали теги на основе контента для достижения множественные эффекты.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/luxe-host.ru/wp-content/uploads/b/b/6/bb688a786363227f65878ef0aa7f54db.jpeg' /><noscript><img loading='lazy' src='/800/600/http/luxe-host.ru/wp-content/uploads/b/b/6/bb688a786363227f65878ef0aa7f54db.jpeg' /></noscript> Например, все популярные браузеры отображают далее жирным шрифтом и курсивом:</p><pre> <b><i>Она дует!</i></b> </pre><p> Другие браузеры могут игнорировать такое вложение. Стандарты требовать от браузера «делать все возможное», чтобы поддерживать все возможные сочетание стилей, но не определяют, как браузер должен обрабатывать такие комбинации. Хотя большинство браузеров делают хорошую попытку сделать поэтому не думайте, что вам будут доступны все комбинации.</p><h2><span class="ez-toc-section" id="_InDesign"> Форматирование текста в InDesign </span></h2><ol><li> Руководство пользователя InDesign <br/></li><li> Знакомство с InDesign <br/><ol><li> Введение в InDesign <br/><ol><li> Новые возможности InDesign <br/></li><li> Системные требования <br/></li><li> Общие вопросы <br/></li><li> Использование библиотек Creative Cloud <br/></li></ol></li><li> Рабочее пространство<ol><li> Основы рабочего пространства <br/></li><li> Ящик для инструментов <br/></li><li> Настройка параметров <br/></li><li> Сенсорное рабочее пространство <br/></li><li> Сочетания клавиш по умолчанию</li><li> Восстановление документа и отмена 904:30<li> Расширение захвата</li></ol></li></ol></li><li> Создание и компоновка документов <br/><ol><li> Документы и страницы<ol><li> Создание документов</li><li> Работа с родительскими страницами</li><li> Работа со страницами документа</li><li> Установка размера страницы, полей и выхода за обрез</li><li> Работа с файлами и шаблонами</li><li> Создать файлы книги</li><li> Добавить базовую нумерацию страниц</li><li> Нумерация страниц, глав и разделов</li><li> Преобразование документов QuarkXPress и PageMaker 904:30<li> Поделиться контентом</li><li> Понимание основного рабочего процесса с управляемыми файлами</li><li> Сохранить документы</li></ol></li><li> Сетки<ol><li> Сетки</li><li> Формат сетки</li></ol></li><li> Вспомогательные макеты<ol><li> Линейки</li></ol></li></ol></li><li> Добавить содержимое <br/><ol><li> Текст<ol><li> Добавить текст во фреймы</li><li> Текст с резьбой</li><li> Функции арабского языка и иврита в InDesign</li><li> Создать тип по пути</li><li> Пули и нумерация 904:30<li> Глифы и специальные символы</li><li> Текстовая композиция</li><li> Текстовые переменные</li><li> Создание QR-кодов</li><li> Редактировать текст</li><li> Выровнять текст</li><li> Обтекание текстом объектов</li><li> Закрепленные объекты</li><li> Связанный контент</li><li> Форматирование абзацев</li><li> Символы формата</li><li> Найти/Изменить</li><li> Проверка орфографии и языковые словари</li></ol></li><li> Типографика<ol><li> Использование шрифтов в InDesign 904:30<li> Кернинг и трекинг</li></ol></li><li> Форматировать текст<ol><li> Форматировать текст</li><li> Работа с пакетами стилей</li><li> Вкладки и отступы</li></ol></li><li> Проверить текст<ol><li> Отследить и просмотреть изменения</li><li> Добавление редакционных примечаний в InDesign</li><li> Импорт комментариев PDF</li></ol></li><li> Добавить ссылки<ol><li> Создать оглавление</li><li> Сноски</li><li> Создать индекс</li><li> Примечания</li><li> Подписи 904:30</ol></li><li> Стили<ol><li> Стили абзацев и символов</li><li> Сопоставление, экспорт и управление стилями</li><li> Стили объектов</li><li> Буквицы и вложенные начертания</li><li> Работа со стилями</li><li> Ведущий</li></ol></li><li> Таблицы<ol><li> Форматирование таблиц</li><li> Создание таблиц</li><li> Стили таблиц и ячеек</li><li> Выбор и редактирование таблиц</li><li> Обводка и заливка таблицы</li></ol></li><li> Интерактивность<ol><li> Гиперссылки 904:30<li> Динамические PDF-документы</li><li> Закладки</li><li> Кнопки</li><li> Формы</li><li> Анимация</li><li> Перекрестные ссылки</li><li> PDF-файлы структуры</li><li> Переходы между страницами</li><li> Фильмы и звуки</li><li> Формы</li></ol></li><li> Графика<ol><li> Понимание контуров и форм</li><li> Рисование с помощью инструмента «Карандаш»</li><li> Рисование с помощью инструмента «Перо»</li><li> Применить настройки линии (штриха)</li><li> Составные контуры и формы 904:30<li> Редактировать пути</li><li> Пути обрезки</li><li> Изменить внешний вид угла</li><li> Выравнивание и распределение объектов</li><li> Связанная и встроенная графика</li><li> Интеграция активов AEM</li></ol></li><li> Цвет и прозрачность<ol><li> Применить цвет</li><li> Использовать цвета из импортированной графики</li><li> Работа с образцами</li><li> Краски смешанные</li><li> Оттенки</li><li> Понимание плашечных и триадных цветов</li><li> Смешивание цветов</li><li> Градиенты 904:30<li> Сведение прозрачного изображения</li><li> Добавить эффекты прозрачности</li></ol></li></ol></li><li> Общий доступ<ol><li> Работа с документами InDesign Cloud</li><li> Облачные документы InDesign | Общие вопросы</li><li> Общий доступ и совместная работа        </li><li> Поделиться для обзора</li><li> Просмотр общего документа InDesign</li><li> Управление отзывами </li></ol></li><li> Публикация <br/><ol><li> Размещение, экспорт и публикация<ol><li> Публикация в Интернете 904:30<li> Копировать, вставить графику</li><li> Экспорт содержимого для EPUB</li><li> Параметры Adobe PDF</li><li> Экспорт содержимого в HTML</li><li> Экспорт в Adobe PDF</li><li> Экспорт в формат JPEG</li><li> Экспорт HTML</li><li> Обзор DPS и AEM Mobile</li><li> Поддерживаемые форматы файлов</li></ol></li><li> Печать<ol><li> Печать буклетов</li><li> Следы печати и кровотечения</li><li> Печать документов</li><li> Чернила, разделение и частота растра 904:30<li> Надпечатка</li><li> Создание файлов PostScript и EPS</li><li> Файлы предварительной проверки перед передачей</li><li> Печать эскизов и документов большого размера</li><li> Подготовка PDF-файлов для поставщиков услуг</li><li> Подготовка к печати цветоделений</li></ol></li></ol></li><li> Расширение InDesign <br/><ol><li> Автоматизация<ol><li> Объединение данных</li><li> Плагины</li><li> Расширение Capture в InDesign</li><li> Сценарий</li></ol></li></ol> 904:30<li> Устранение неполадок<ol><li> Исправленные проблемы</li><li> Сбой при запуске <br/></li><li> Папка настроек доступна только для чтения</li><li> Устранение проблем с файлами</li><li> Невозможно экспортировать PDF</li><li> Восстановление документа InDesign</li></ol></li></ol><p><h3><span class="ez-toc-section" id="i-22"> Формат текста </span></h3></p><p> Использование Панель управления для изменения внешнего вида текста.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/fuzeservers.ru/wp-content/uploads/6/c/a/6ca648d2c7b00ea0b222140a3b99d5c0.jpeg' /><noscript><img loading='lazy' src='/800/600/http/fuzeservers.ru/wp-content/uploads/6/c/a/6ca648d2c7b00ea0b222140a3b99d5c0.jpeg' /></noscript> Когда текст выбран или когда точка вставки помещена в текст, панель управления отображает либо элементы управления форматированием символов, либо форматирование абзаца элементы управления или их комбинацию, в зависимости от разрешения вашего монитора. Эти же элементы управления форматированием текста отображаются на панели «Символ» и Панель абзаца. Вы также можете использовать панель «Символ» и «Абзацы». панель для изменения внешнего вида текста.</p><p> Примечание следующие методы форматирования текста:</p><ul><li><p> Для форматирования символов, вы можете использовать инструмент "Текст", чтобы выберите символы, или вы можете щелкнуть, чтобы поместить точку вставки, выберите параметр форматирования, а затем начните печатать.</p></li><li><p> Для форматирования абзацев не нужно выделять весь абзац — выделение любого слова или символа или размещение вставки точка в абзаце подойдет. Вы также можете выделить текст в диапазоне пунктов.</p></li><li><p> Чтобы установить форматирование для всех будущих текстовых фреймов, которые вы создать в текущем документе, убедитесь, что точка вставки не активен и что ничего не выделено, а затем указать текст варианты форматирования.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/1.bp.blogspot.com/-qA1PfypnOnY/XeeOs0lskAI/AAAAAAAAEUM/SffWzUTaOyYLrZvYMIpwDaniQD_6hY5BQCLcBGAsYHQ/s1600/%25D1%2581%25D1%2582%25D0%25B8%25D0%25BB%25D0%25B8%2B%25D1%2588%25D1%2580%25D0%25B8%25D1%2584%25D1%2582%25D0%25B0.jpg' /><noscript><img loading='lazy' src='/800/600/http/1.bp.blogspot.com/-qA1PfypnOnY/XeeOs0lskAI/AAAAAAAAEUM/SffWzUTaOyYLrZvYMIpwDaniQD_6hY5BQCLcBGAsYHQ/s1600/%25D1%2581%25D1%2582%25D0%25B8%25D0%25BB%25D0%25B8%2B%25D1%2588%25D1%2580%25D0%25B8%25D1%2584%25D1%2582%25D0%25B0.jpg' /></noscript> Чтобы установить форматирование текста по умолчанию для всех новых документов, закройте все документы, а затем укажите параметры текста. См. набор значения по умолчанию.</p></li><li><p> Выберите фрейм, чтобы применить форматирование ко всему тексту внутри него. Фрейм не может быть частью потока.</p></li><li><p> Использовать стили абзацев и стили символов для форматирования текста быстро и последовательно.</p></li></ul><ol><li><p data-readability-styled="true"> Выберите инструмент «Текст».</p></li><li><p> Щелкните, чтобы разместить точку вставки, или выберите текст который вы хотите отформатировать.</p></li><li><p data-readability-styled="true"> На панели управления щелкните элемент управления форматированием символов значок или значок управления форматированием абзаца  .</p> Панель управления<p> <b> A. </b> Элементы управления форматированием символов  <b> B. </b> Абзац элементы управления форматированием</p></li><li><p> Укажите параметры форматирования.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/cf3.ppt-online.org/files3/slide/o/OME5PbxU2SyJKNpYnWaHzRiwh138CDQgTZ7koX/slide-60.jpg' /><noscript><img loading='lazy' src='/800/600/http/cf3.ppt-online.org/files3/slide/o/OME5PbxU2SyJKNpYnWaHzRiwh138CDQgTZ7koX/slide-60.jpg' /></noscript></p></li></ol><p><h3><span class="ez-toc-section" id="i-23"> Приоритет форматирования текста </span></h3></p><p> Для форматирования текста с такими атрибутами, как стиль шрифта и направление текста, можно использовать несколько различных методов. Например, вы можете использовать панель управления, параметры сетки фреймов, именованные сетки или стили текста. Если вы используете более одного метода и атрибуты конфликтуют друг с другом, InDesign должен выбрать, какой атрибут использовать. Порядок старшинства следующий:</p><ol><li><p> Атрибут символа переопределяет</p></li><li><p> Стиль символов</p></li><li><p> Атрибут абзаца переопределяет</p></li><li><p> Стиль абзаца</p></li><li><p> Атрибуты сетки CJK (либо из именованной сетки, либо из Frame диалоговое окно «Параметры сетки»)</p></li><li><p> Приложение по умолчанию (стиль корневого абзаца)</p></li></ol><p> Например, если вы укажете один размер шрифта в параметрах сетки фрейма и другой размер в стиле символов, будет использоваться размер шрифта из стиля символов.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/cf.ppt-online.org/files/slide/u/UyDbTA490niMqpoBV8efcX23ZtNCOr5K7xQkWa/slide-21.jpg' /><noscript><img loading='lazy' src='/800/600/http/cf.ppt-online.org/files/slide/u/UyDbTA490niMqpoBV8efcX23ZtNCOr5K7xQkWa/slide-21.jpg' /></noscript> Точно так же, если вы включаете стиль абзаца и именованную сетку в стиль объекта, стиль абзаца имеет приоритет над именованной сеткой.</p><p><h3><span class="ez-toc-section" id="i-24"> Атрибуты типа копирования (Пипетка) </span></h3></p><p> Можно использовать инструмент «Пипетка» для копирования атрибутов типа, таких как символ, абзац, заливка и настройки обводки, а затем примените эти атрибуты к другому типу. К по умолчанию инструмент «Пипетка» копирует все атрибуты типа. Настроить атрибуты, которые вы хотите скопировать с помощью инструмента «Пипетка», используйте кнопку Диалоговое окно «Параметры пипетки».</p><p> Доступен инструмент «Пипетка» только в режиме макета.</p><p><h3><span class="ez-toc-section" id="i-25"> Копировать атрибуты типа в невыбранное текст </span></h3></p><ol><li><p data-readability-styled="true"> С помощью инструмента «Пипетка» нажмите текст, отформатированный с атрибутами, которые вы хотите скопировать. (Текст может находиться в другом открытом документе.) Указатель пипетки меняет направление и выглядит полным  , чтобы указать, что он загружен с атрибутами, которые вы скопировали.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/luxe-host.ru/wp-content/uploads/5/f/a/5fa5046cb0e8c2142ece5b92300afb60.jpeg' /><noscript><img loading='lazy' src='/800/600/http/luxe-host.ru/wp-content/uploads/5/f/a/5fa5046cb0e8c2142ece5b92300afb60.jpeg' /></noscript> Когда ты поместите указатель пипетки на текст, затем появится двутавровая балка к загруженной пипетке  .</p></li><li><p> С помощью инструмента «Пипетка» выделите текст, который хотите изменение.</p><p> Выделенный текст принимает загруженные атрибуты в пипетке. Пока выбран инструмент «Пипетка», вы можно продолжить выделение текста для применения форматирования.</p></li><li><p> Чтобы отменить выбор инструмента «Пипетка», щелкните другой инструмент.</p></li></ol><p>  Чтобы очистить атрибуты форматирования, которые в настоящее время хранятся в инструменте «Пипетка», нажмите клавишу «Alt» (Windows) или «Option» (macOS), когда инструмент «Пипетка» загружен. Инструмент "Пипетка" меняет направление и становится пустым , что указывает на то, что он готов использовать новые атрибуты. Щелкните объект, содержащий атрибуты, которые вы хотите скопировать, затем перетащите новые атрибуты на другой объект. <br/></p> Пипетка щелкает форматированный текст, чтобы скопировать его форматирование.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/cf2.ppt-online.org/files2/slide/c/cfoS1ve0ZMklLpKzWsgENbmFPXatBxVdTYiI3G/slide-5.jpg' /><noscript><img loading='lazy' src='/800/600/http/cf2.ppt-online.org/files2/slide/c/cfoS1ve0ZMklLpKzWsgENbmFPXatBxVdTYiI3G/slide-5.jpg' /></noscript> (слева), а затем перетащите его по неформатированному тексту (посередине), чтобы применить это форматирование (справа).<p> Если вы используете Пипетку инструмент для копирования стиля абзаца из текста в одном документе в текст в другом, и стиль абзаца имеет то же имя, но другое наборы атрибутов, любые различия стилей будут отображаться как локальные переопределения к целевому стилю.</p><p><h3><span class="ez-toc-section" id="i-26"> Атрибуты типа копирования в выбранные текст </span></h3></p><ol><li><p data-readability-styled="true"> С помощью инструмента «Текст» или Инструмент "Тип пути" выберите текст, в который вы хотите скопировать атрибуты.</p></li><li><p data-readability-styled="true"> С помощью инструмента «Пипетка» нажмите текст, из которого вы хотите скопировать атрибуты. (Текст из атрибуты, которые вы хотите скопировать, должны находиться в одном документе InDesign. как текст, который вы хотите изменить.) Инструмент «Пипетка» меняет направление и кажется полным  , чтобы указать, что он загружен с атрибутами, которые вы скопировали.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/cf.ppt-online.org/files/slide/h/HJXw2npMUCxNc9YBuOr5aVbvmlKRfyGh7i6A4k/slide-20.jpg' /><noscript><img loading='lazy' src='/800/600/http/cf.ppt-online.org/files/slide/h/HJXw2npMUCxNc9YBuOr5aVbvmlKRfyGh7i6A4k/slide-20.jpg' /></noscript> Атрибуты применяются к тексту, выбранному на шаге 1.</p></li></ol> Атрибуты типа, скопированные в выделенный текст<p><h3><span class="ez-toc-section" id="i-27"> Изменить атрибуты текста, Копии пипетки </span></h3></p><ol><li><p> В наборе инструментов дважды щелкните пипетку инструмент.</p></li><li><p> Выберите Параметры символов или Параметры абзаца в Диалоговое окно «Параметры пипетки».</p></li><li><p> Выберите атрибуты, которые вы хотите скопировать с помощью пипетки инструмент, а затем нажмите ОК.</p></li></ol><p>  Чтобы скопировать или применить только атрибуты абзаца, не изменяя настройки в диалоговом окне «Параметры пипетки», удерживайте нажатой клавишу Shift, щелкая текст с помощью инструмента «Пипетка». <br/></p><p><h3><span class="ez-toc-section" id="_Quick_Apply"> Используйте Quick Apply </span></h3></p><p> Используйте Quick Apply для поиска и применения стилей, команды меню, скрипты, переменные и большинство других команд, которые можно найти в диалоговом окне «Сочетания клавиш».</p><ol><li><p> Выберите текст или рамку, к которой вы хотите применить стиль, команду меню, сценарий или переменную.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/images.slideplayer.com/16/5212985/slides/slide_17.jpg' /><noscript><img loading='lazy' src='/800/600/http/images.slideplayer.com/16/5212985/slides/slide_17.jpg' /></noscript></p></li><li><p> Выберите «Правка» > «Быстрое применение» или нажмите Ctrl+Enter. (Windows) или Command + Return (Mac OS).</p></li><li><p> Начните вводить название предмета, который хотите применить.</p><p> Имя, которое вы вводите, не обязательно должно совпадать. За например, набрав, он найдет такие стили, как как Заголовок 1, Заголовок 2 и Подзаголовок, а также Справка команды меню, такие как меню справки > InDesign. Помощь.</p> Используйте Quick Apply для поиска стилей, команд меню, сценариев и переменные.<p>  Вы можете ограничить поиск только одной категорией, введя соответствующий префикс в начале поиска, например, m: для меню или p: для стилей абзаца. Чтобы просмотреть список префиксов, щелкните стрелку вниз слева от текстового поля «Быстрое применение». Вы можете отменить выбор категорий в этом списке, которые вы не хотите отображать. <br/></p></li><li><p> Выберите элемент, который хотите применить, а затем:</p><ul><li><p> Чтобы применить стиль, команду меню или переменную, нажмите Enter или Return.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/image2.slideserve.com/4913123/slide13-l.jpg' /><noscript><img loading='lazy' src='/800/600/http/image2.slideserve.com/4913123/slide13-l.jpg' /></noscript></div></div></div></article><nav class="navigation post-navigation" aria-label="Записи"><h2 class="screen-reader-text">Навигация по записям</h2><div class="nav-links"><div class="nav-previous"><a href="https://xn--90abhccf7b.xn--p1ai/raznoe/ot-bessonniczy-chto-delat-bessonnicza-chto-delat-stati-ot-kompanii-elamed.html" rel="prev">От бессонницы что делать: Бессонница – что делать? &#8212; статьи от компании Еламед</a></div><div class="nav-next"><a href="https://xn--90abhccf7b.xn--p1ai/raznoe/kak-proverit-foto-fejk-ili-net-13-onlajn-instrumentov-dlya-proverki-podlinnosti-fotografij.html" rel="next">Как проверить фото фейк или нет: 13 онлайн-инструментов для проверки подлинности фотографий</a></div></div></nav><div id="comments" class="comments-area"><div id="respond" class="comment-respond"><h3 id="reply-title" class="comment-reply-title">Добавить комментарий <small><a rel="nofollow" id="cancel-comment-reply-link" href="/html/kak-v-html-zadat-stil-teksta-kak-sdelat-krasivyj-shrift-v-html-razmery-czveta-tegi-shriftov-html.html#respond" style="display:none;">Отменить ответ</a></small></h3><form action="https://xn--90abhccf7b.xn--p1ai/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Ваш адрес email не будет опубликован.</span> <span class="required-field-message">Обязательные поля помечены <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Комментарий <span class="required">*</span></label><textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Имя <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required /></p><p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required /></p><p class="comment-form-url"><label for="url">Сайт</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url" /></p><p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Отправить комментарий" /> <input type='hidden' name='comment_post_ID' value='46953' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /></p></form></div></div></main></div><div id="sidebar-primary" class="widget-area sidebar " role="complementary"><div class="sidebar-main"><div id="yandex_rtb_R-A-744004-7" class="yandex-adaptive classYandexRTB"></div> <script type="text/javascript"> window.yaContextCb.push(()=>{Ya.Context.AdvManager.render({renderTo: "yandex_rtb_R-A-744004-7",blockId: "R-A-744004-7",pageNumber: 11,onError: (data) => { var g = document.createElement("ins"); g.className = "adsbygoogle"; g.style.display = "inline"; g.style.width = "300px"; g.style.height = "600px"; g.setAttribute("data-ad-slot", "9935184599"); g.setAttribute("data-ad-client", "ca-pub-1812626643144578"); g.setAttribute("data-alternate-ad-url", "https://chajnov.ru/back.php"); document.getElementById("yandex_rtb_[rtbBlock]").appendChild(g); (adsbygoogle = window.adsbygoogle || []).push({}); }})}); window.addEventListener("load", () => { var ins = document.getElementById("yandex_rtb_R-A-744004-7"); if (ins.clientHeight == "0") { ins.innerHTML = stroke2; } }, true); </script><section id="search-2" class="widget widget_search"><div class="zita-widget-content"><form role="search" method="get" id="searchform" action="https://xn--90abhccf7b.xn--p1ai/"><div class="form-content"> <input type="text" placeholder="search.." name="s" id="s" value=""/> <input type="submit" value="Search" /></div></form></div></section><section id="nav_menu-4" class="widget widget_nav_menu"><div class="zita-widget-content"><h2 class="widget-title">Рубрики</h2><div class="menu-2-container"><ul id="menu-2" class="menu"><li id="menu-item-19021" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19021"><a href="https://xn--90abhccf7b.xn--p1ai/category/css">Css</a></li><li id="menu-item-19022" class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-19022"><a href="https://xn--90abhccf7b.xn--p1ai/category/html">Html</a></li><li id="menu-item-19023" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19023"><a href="https://xn--90abhccf7b.xn--p1ai/category/js">Js</a></li><li id="menu-item-19024" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19024"><a href="https://xn--90abhccf7b.xn--p1ai/category/adaptiv">Адаптивный сайт</a></li><li id="menu-item-19025" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19025"><a href="https://xn--90abhccf7b.xn--p1ai/category/verstk">Верстка</a></li><li id="menu-item-19026" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19026"><a href="https://xn--90abhccf7b.xn--p1ai/category/idei">Идеи</a></li><li id="menu-item-19028" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19028"><a href="https://xn--90abhccf7b.xn--p1ai/category/chego-nachat">С чего начать</a></li><li id="menu-item-19029" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19029"><a href="https://xn--90abhccf7b.xn--p1ai/category/sovety">Советы</a></li><li id="menu-item-19031" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19031"><a href="https://xn--90abhccf7b.xn--p1ai/category/shablon">Шаблоны</a></li><li id="menu-item-19027" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19027"><a href="https://xn--90abhccf7b.xn--p1ai/category/raznoe">Разное</a></li></ul></div></div></section></div></div></div></div><footer id="zita-footer"><div class="footer-wrap widget-area"><div class="bottom-footer"><div class="bottom-footer-bar ft-btm-one"><div class="container"><div class="bottom-footer-container"> © Компания <a href="http://вебджем.рф"> Вебджем.рф </a> 2009 - 2024 | Все права защищены.</a></div></div></div></div></div></footer> <noscript><style>.lazyload{display:none}</style></noscript><script data-noptimize="1">window.lazySizesConfig=window.lazySizesConfig||{};window.lazySizesConfig.loadMode=1;</script><script async data-noptimize="1" src='https://xn--90abhccf7b.xn--p1ai/wp-content/plugins/autoptimize/classes/external/js/lazysizes.min.js'></script> <script defer src="https://xn--90abhccf7b.xn--p1ai/wp-content/cache/autoptimize/js/autoptimize_eacc7423ae55f04fc134551454013fc2.js"></script></body></html><script src="/cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js" data-cf-settings="806c51936c5e1408f1cd37a5-|49" defer></script>