April 20, 2020

[Урок 21] Первый сайт на Zero Block (3 часть - работаем с текстом)

Всем доброго утра! Как ваши выходные? Готовы продолжать учиться делать сайты?

Сегодня мы продолжим верстать наш сайт в Zero Block, а конкретнее разберёмся с текстами в главном блоке. Поехали!)

Вот на чём мы остановились во втором уроке.

Приступаем к редактированию Zero Block

Добавляем на страницу текстовый блок. Предварительно подключите шрифт ROBOTO. Он есть в стандартной библиотеке тильды. Как подключить шрифт: https://teletype.in/@sitodeal/EUDjCHvyQ

Делаем два клика на окно с текстом и редактируем сам текст.

Идём в настройки текстового блока

Нажимаем на блок с текстом и жмём на его настройки (settings в нижнем правом углу).

Цвет: черный

Размер: 70 (исходя из макета)

Шрифт: Roboto

Weight: начертание ставим Bold

Spacing оставляем неизменным.

В самом вверху настроек нажимаем на данную иконку:

Таким образом мы прикрепим блок к левому краю контейнера.

С настройками всё, если требуется - растягиваем окно текстового блока по ширине, чтобы текст влезал.

Вот такой результат мы получили. Дублируем блок, меняем текст на "Стройка капитала", делаем размер шрифта 65 и устанавливаем блок согласно макету.

Ещё раз создаём текстовый блок, уменьшаем шрифт до 16 и делаем начертание шрифта "Medium". Вставляем текст:

Онлайн марафон по построению своего первого капитала.
3 дня занятий, 2 спикера, личный кабинет и домашние задания.

Выделяем все 3 блока, открываем настройки.

Нажимаем на выравнивание по центру, предварително установив галочку на параметке to grid container.

Таким образом мы сделаем выравнивание блоков текста ПО ЦЕНТРУ контейнера. Смотрим что у нас получилось:

Готово! Мы разобрались с текстом. По возможности вы можете установить базовую анимацию для него. В следующих уроках мы займёмся изображениями, анимацией и многим другим. Успехов!)