Портфолио недавних проектов CSS шаблон
Графитовое обрамление и восемь выровненных плиток проектов
Темно-графитовая область заголовка задает визуальную отправную точку этого блока, а желтый акцентный текст и короткий разделитель отделяют вводный ярлык от следующей за ним галереи. «ПОРТФОЛИО» расположено над надписью «НЕДАВНИЕ ПРОЕКТЫ», создавая выровненную по центру типографическую иерархию до того, как посетители перейдут к просмотру снимков. Контраст между темным фоном заголовка и разнообразными архитектурными фотографиями делает переход к сетке проектов четким и заметным.
Под областью заголовков восемь изображений заполняют всю доступную ширину секции в виде двух рядов по четыре одинаковые прямоугольные плитки. Их плотно подогнанные границы создают единый ритм, даже несмотря на то, что на фотографиях запечатлены разные современные строения, фасады и элементы конструкций в синих, серых и теплых нейтральных оттенках. При работе с CSS-шаблоном основной упор делается на элементы самого блока: соотношение графитового фона, желтого акцента, разделителя, масштаба заголовков, отступов между плитками, кадрирования изображений и компоновки галереи от края до края.
Эти параметры можно настраивать без изменения структуры содержимого портфолио. Восемь фотографий проектов остаются статичным визуальным материалом, тогда как цвет, типографика, выравнивание, границы, отступы и подача изображений определяют четкость обрамления галереи. В итоге получается стилистический ориентир для секции архитектурных проектов, а не дизайн-система для всего сайта.
Настроить с помощью Nicepage
При использовании Конструктор шаблонов CSS вы сможете настраивать цвета, шрифты, верхний и нижний колонтитулы, макет, столбцы и другие элементы дизайна, а также контент и изображения.
Редактировать шаблон в автономном режиме
2. Создайте новую страницу или выберите существующую.
3. Нажмите "Добавить новый блок", найдите идентификатор 42321 и нажмите "Ввод".
Редактировать шаблон онлайн
Создавайте потрясающие сайты
Бесплатный конструктор Nicepage Builder
Ключевые слова
Настройка этого шаблона с помощью CSS
Управление стилем для каждой страницы
Настройте внешний вид этого готового шаблона непосредственно в редакторе Nicepage. Регулируйте типографику, отступы, фон, границы, цвета, позиционирование и другие свойства стиля с помощью визуальных элементов управления, сохраняя при этом простоту управления макетом страницы без необходимости ручного написания CSS.
Добавление пользовательского CSS при необходимости
Для требований к стилю, выходящих за рамки стандартных параметров редактора, используйте Пользовательский CSS для добавления целевых правил. CSS может применяться к отдельным элементам, конкретным страницам или всему веб-сайту в зависимости от масштаба настройки, а классы CSS могут использоваться для связи пользовательских правил с выбранными элементами.
Экспорт минимального CSS для каждой страницы
Для проектов, где важны размер CSS и производительность страницы, Nicepage может экспортировать минимальный CSS для каждой страницы. Вместо использования одного большого общего файла стилей, каждая страница может использовать отдельный CSS-файл, содержащий только необходимые для этой конкретной страницы правила стиля. Согласно документации Nicepage, эти CSS-файлы, специфичные для каждой страницы, могут быть примерно в десять раз компактнее, что помогает уменьшить количество ненужного CSS и улучшить скорость загрузки страницы.
Этот рабочий процесс сочетает визуальное оформление с дополнительным пользовательским CSS и оптимизированным выводом CSS для каждой страницы, предоставляя вам дополнительный контроль, когда это необходимо для проекта, без необходимости делать ручное редактирование CSS основным способом настройки шаблона.
Больше из Архитектура и строительство Blocks
-
EN
-
-
EN
-
EN
-
EN
-
EN
-
EN
-
-
-
EN
-
-
-
EN
-
-
-
EN
-
EN
-
-
-
Больше из Широкий Blocks
-
-
EN
-
-
-
EN
-
EN
-
EN
-
-
EN
-
-
EN
-
EN
-
-
EN
-
-
EN
-
EN
-
EN
-
-
EN
