Перейти к содержанию

Форматированный текст: различия между версиями

Материал из Химсофт Вики
 
(не показаны 4 промежуточные версии 2 участников)
Строка 6: Строка 6:


==Ввод текста==
==Ввод текста==
*выбрать у элемента <code>FormattedText</code> свойство <code>Data >> Html</code> (рис. 6.1);
*выбрать у элемента <code>FormattedText</code> свойство <code>Data >> Html</code>;
*вызвать с помощью пункта <code>Expression…</code> (рис. 6.1) окно <code>Expression Editor</code> (рис. 6.2);
[[Файл:Formatted.png|center]]
*вызвать с помощью пункта <code>Expression…</code> (рис. 6.1) окно <code>Expression Editor</code>;
[[Файл:Formatted2.png|center]]
*ввести HTML-код в поле <code>Expression:</code>.
*ввести HTML-код в поле <code>Expression:</code>.


Строка 16: Строка 18:
*элемент управления <code>FormattedText</code> поддерживает многие (но не все) стили CSS;
*элемент управления <code>FormattedText</code> поддерживает многие (но не все) стили CSS;
*при использовании допустимых HTML-тегов, которые не поддерживаются дизайнером, они будут игнорироваться.
*при использовании допустимых HTML-тегов, которые не поддерживаются дизайнером, они будут игнорироваться.
==Индексы (надстрочные и подстрочные)==
===Управление вертикальным смещением===
В CSS стандартные свойства <code>vertical-align:</code> для <code>sup</code> и <code>sub</code> имеют фиксированные алгоритмы смещения.
Использование пунктов (pt) или пикселей (px) позволяет тонко настроить положение:
*<code>vertical-align: 2pt;</code> — положительное значение поднимает <code>sup</code> (надстрочный индекс) выше базовой линии; чем больше число, тем больше «отрыв» от текста;
*<code>vertical-align: -1pt;</code> — отрицательное значение опускает <code>sub</code> (подстрочный индекс); это критично для предотвращения наложения индекса на выносные элементы букв (например, у буквы «р» или «у»).
===Изменение размера индексов===
По умолчанию браузеры уменьшают индексы до ~75% от размера родителя.
*<code>font-size: 7px;</code> — жесткое задание размера (в данном случае относительно основного текста в 9px) делает формулы и единицы измерения более читаемыми и аккуратными;
*для лучшей адаптивности можно использовать проценты (например, <code>font-size: 75%</code>) или единицы <code>em</code>.
===Влияние на межстрочный интервал (Line-height)===
Одной из главных проблем индексов является «раздвигание» строк.
Свойство <code>line-height: 1.2;</code> в сочетании с явным указанием <code>vertical-align</code> для индексов помогает сохранить ритм вертикальной сетки.
Если индексы сильно смещены, они могут увеличить высоту отдельной строки, что визуально портит блок текста.
Для решения этой проблемы индексам часто добавляют <code>line-height: 0;</code>.
===Пример использования===
<syntaxhighlight lang="html">
<style>
body {font-family: 'Times New Roman', Times, serif; font-size: 9px; line-height: 1.2;}
sup {vertical-align: 2pt; font-size: 7px;}
sub {vertical-align: -1pt; font-size: 7px;}
</style>
<body>
Fields!unit.Value
</body>
</syntaxhighlight>
[[Category:Внутренняя документация]]
[[Category:Тритея]]
[[Category:Дизайнер_документов]]

Текущая версия от 09:37, 23 марта 2026

Форматированный текст (FormattedText) - элемент отображения текстовых данных с форматированием.

Общие сведения

  • может выполнять операции слияния данных;
  • может отображать форматированный текст в формате HTML (например – при отображении формул или единиц измерения, содержащих надстрочные и/или подстрочные символы).

Ввод текста

  • выбрать у элемента FormattedText свойство Data >> Html;
  • вызвать с помощью пункта Expression… (рис. 6.1) окно Expression Editor;
  • ввести HTML-код в поле Expression:.

Особенности

  • элемент FormattedText отображает введенный HTML-текст с применённым форматированием (итоговый вариант можно увидеть в режиме предварительного просмотра Preview;
  • весь текст, написанный в свойстве Html, должен быть заключен в тег <body></body>;
  • в поле ввода текста «Expression:» возможно использование почти все HTML-теги и атрибуты из спецификации XHTML 1.1 (подробнее см. https://www.w3.org/TR/xhtml11/) с некоторыми расширениями для частичной поддержки спецификации HTML5 (подробнее см. https://www.w3.org/TR/2011/WD-html5-20110405/);
  • элемент управления FormattedText поддерживает многие (но не все) стили CSS;
  • при использовании допустимых HTML-тегов, которые не поддерживаются дизайнером, они будут игнорироваться.

Индексы (надстрочные и подстрочные)

Управление вертикальным смещением

В CSS стандартные свойства vertical-align: для sup и sub имеют фиксированные алгоритмы смещения.

Использование пунктов (pt) или пикселей (px) позволяет тонко настроить положение:

  • vertical-align: 2pt; — положительное значение поднимает sup (надстрочный индекс) выше базовой линии; чем больше число, тем больше «отрыв» от текста;
  • vertical-align: -1pt; — отрицательное значение опускает sub (подстрочный индекс); это критично для предотвращения наложения индекса на выносные элементы букв (например, у буквы «р» или «у»).

Изменение размера индексов

По умолчанию браузеры уменьшают индексы до ~75% от размера родителя.

  • font-size: 7px; — жесткое задание размера (в данном случае относительно основного текста в 9px) делает формулы и единицы измерения более читаемыми и аккуратными;
  • для лучшей адаптивности можно использовать проценты (например, font-size: 75%) или единицы em.

Влияние на межстрочный интервал (Line-height)

Одной из главных проблем индексов является «раздвигание» строк.

Свойство line-height: 1.2; в сочетании с явным указанием vertical-align для индексов помогает сохранить ритм вертикальной сетки.

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

Для решения этой проблемы индексам часто добавляют line-height: 0;.

Пример использования

<style>
	body {font-family: 'Times New Roman', Times, serif; font-size: 9px; line-height: 1.2;}
	sup {vertical-align: 2pt; font-size: 7px;}
	sub {vertical-align: -1pt; font-size: 7px;} 
</style> 
<body> 
	Fields!unit.Value
</body>