Как оформить блок: рамка, фон, отступы, тень

← Назад

Наведите на блок и нажмите шестерёнку — откроется окно стилей с вкладками «Граница», «Блок», «Текст», «Ссылки», «Анимация», «Позиционирование».

Шестерёнка появляется при наведении на блок — у шапки, подвала, области контента, колонок формы, карточек. Она открывает окно стилей. Правки сохраняются сами, по ходу ввода; кнопка «Очистить» сбрасывает оформление блока.

Что где лежит:

  • «Граница» — положение (все стороны или отдельная), цвет, толщина, скругление углов.
  • «Блок» — цвет фона, градиент («Использовать градиент фона»), «Тень блока», «Внутренний отступ» и «Внешний отступ», фоновое изображение, ширина и высота (в том числе минимальная и максимальная), «Выравнивание текста» и «Выравнивание блока», «Видимость» — скрыть блок на ПК, планшете или телефоне.
  • «Текст» — шрифт, размер, цвет.
  • «Ссылки» — цвет ссылок внутри блока отдельно от обычного текста.
  • «Анимация» — появление, реакция на наведение и постоянное движение.
  • «Позиционирование» — «Тип позиционирования» (блок, прилипающий к верху или низу окна), смещение, поворот.

Вид при наведении задаётся переключателем в шапке окна: «Обычный» / «При наведении» / «Активный» (последний — только у пунктов меню). На вкладках «Граница», «Блок», «Текст» и «Ссылки» настройки относятся к выбранному состоянию; пустое поле значит «как в обычном».

Главный переключатель — «Применить только для данного блока». Без галочки настройка действует на все блоки этого вида по всему сайту: поставили рамку области контента — она появится на каждой странице. С галочкой — только на этом блоке этой страницы.

Если не получилось

  • Оформился не тот блок. Блоки вложены друг в друга: наводите точнее, шестерёнка появляется у того блока, над которым курсор.
  • Поменяли на одной странице — изменилось везде. Не была поставлена галочка «Применить только для данного блока». Верните значение и повторите с галочкой.
  • Выравнивание текста не работает. Проверьте, не задано ли на этом же блоке выравнивание самого блока — они спорят друг с другом.
Помогла статья?

Смотрите также