Heading 🔗
Аналог стандартных тегов h1 - h6 в HTML
Пример использования:
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Исходный код для примера выше:
<Heading size={1} margin={{ top: 0 }}>Heading 1</Heading>
<Heading size={2} margin={{ top: 0 }}>Heading 2</Heading>
<Heading size={3} margin={{ top: 0 }}>Heading 3</Heading>
Параметры:
size enum
required
Размер заголовка.
Поддерживаются значения от 1
до 6
color string
Цвет текста в компоненте.
Поддерживаются любые валидные значения CSS (Например: #0000FF
, var(--blue)
или magenta
)
Значение по умолчанию: black
margin object
Объект, описывающий отступы компонента. Имеет следующие свойства:
x
– отступ по горизонтали
y
– отступ по вертикали
top
– отступ сверху
bottom
– отступ снизу
left
– отступ слева
right
– отступ справа
Все значения могут иметь один из двух типов: string
или number
В случае, если значение одного из свойств имеет тип number
, ему будет добавлена единица измерения em
Пример: margin={{ top: 1, x: 'auto' }}
будет преобразовано в margin: 1em auto 0
node HTMLElement
Параметр для связки с HTML-элементом, который лежит в основе компонента
(аналог стандартного bind:this
)
align enum
Выравнивание текста внутри компонента
Поддерживаются 5 значений: unset
, initial
, left
, center
и right
Значение по умолчанию: unset
id string
Аналог стандартного атрибута id
className string
Аналог стандартного атрибута class