Основы макета

Last updated on 12/2/2024@mrbirddev

Структура веб-страницы slidde

Slidde.co использует простую четырехслойную структуру:

Страница

(Глобальные стили)

Слайд

(Сегментация контента)

Контейнер

(Адаптивная ширина, Несколько колонок)

Встроенные элементы

(Специфический контент)

...

Встроенные элементы

(Специфический контент)

...

Страница

Слой Страница находится наверху и используется для установки глобальных стилей, таких как шрифты, цвета и стили ссылок, так как свойства CSS наследуемы.

При желании вы можете использовать CSS-переменные, чтобы сделать ваш шаблон более удобным для пользователя.

Если вы не можете выбрать элемент Страница напрямую, используйте опцию Выбрать страницу на панели инструментов.

Функция Хеш-секция может симулировать многостраничный веб-сайт. Ознакомьтесь с этим демо: Demo Link

Слайд

Слайд — это элемент первого уровня под Страница, используемый для сегментации контента.

Простые страницы, такие как страницы "ссылка в био", могут иметь только один Slide.
Сложные лендинги могут включать несколько секций, таких как #header, #hero, #works, #contact, #footer.

Якорь (HTML ID) по сути является HTML ID. Назовите их в зависимости от содержимого в Слайд для легкой навигации с использованием ссылок типа “#ID”. Узнайте больше о пропуске ссылок.

Чтобы скрыть Слайд от финального веб-сайта, но сохранить их, отметьте атрибут Скрытый. Это похоже на скрытые слайды в PowerPoint и может также использоваться для учебных материалов.

Функция Липкий предназначена для плавающих навигационных панелей или любых других элементов. Посмотрите пример здесь: Sticky Demo

Контейнер

Контейнер управляет адаптивной шириной и отображением в несколько колонок.

Ширина для мобильных и настольных устройств обычно различается. Используйте атрибут Ширина в Контейнер для адаптивной ширины на разных устройствах.
Колонки определяют, сколько колонок в контейнере. Вы можете установить ширину, например, x/12 (например, две колонки 6/12 для каждой 50% ширины).

Каждая колонка также может иметь настройки горизонтального и вертикального выравнивания.

Другое

Другие элементы являются встроенными элементами, которые могут быть размещены внутри контейнера.

Следуя этому структурированному подходу, вы можете с легкостью создавать визуально привлекательные, адаптивные веб-страницы с использованием Slidde.co.