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