Холст

Холст располагается в центре страницы Редактора дизайна, занимая большую часть экрана. Это основная рабочая область, на которой создается страница сайта и размещаются все элементы, отображающиеся на сайте.

Видео: Холст

Вы можете добавлять элементы на Холст из панели Элементов (Elements) по клику на название элемента или перетащив его на Холст. Подробнее о добавлении элементов на страницу —

Выбор элементов на холсте

Вы можете выбрать элемент на Холсте следующими способами:

Клик: выделяется самый верхний родительский элемент, на который наведен курсор

Двойной клик: выделяется дочерний элемент самого верхнего родителя и так далее вниз по иерархии при последующих кликах

Ctrl + клик: «глубокое» выделение — выделяется непосредственно элемент, на который наведен курсор (самый нижний в иерархии)

Выбранный элемент помечается синей обводкой и меткой с названием наверху.

Хлебные крошки

Внизу хоста можно увидеть «Хлебные крошки» (bread crumbs) — путь в иерархии элементов до выделенного элемента. Их также можно отключить или включить по клавишам Shift + B.

«Хлебные крошки» можно использовать для перехода на родительский элемент или другие элементы выше по иерархии с помощью клика по ним.

Просмотр страницы в режимах отображения для разных устройств

В верхней части Холста вы можете переключаться между режимами отображения страницы для устройств с разной шириной экранов. По умолчанию стоит режим Компьютер (Desktop).

Доступны следующие режимы отображения (Breakpoints):

Компьютер (Desktop)

Планшет — 991px и меньше (Tablet — 991px and down)

Мобильный телефон в горизонтальном режиме — 767px и меньше (Mobile landscape — 767px and down)

Мобильный телефон в портретном режиме — 478px и меньше (Mobile portrait — 478px and down)

Также могут быть добавлены дополнительные Breakpoints (подробнее —

Для переключения режима отображения наведите курсор мыши на верхнюю панель Холста и выберите нужный режим, передвигая курсор по панели, а затем кликнув на выбранную опцию. Для удобства разные режимы подсвечиваются разными цветами.

Для разных режимов отображения можно устанавливать разные стили и менять настройки расположения элементов, чтобы обеспечить адаптивность сайта для различных устройств. Подробнее —

Масштаб отображения холста можно менять в Верхней панели. Подробнее —