Как файл css из lunacy сделать рабочим?
Lunacy, макет 1440, скопировал CSS из панели кода и открыл файл,а вместо страницы просто текст, что еще ему нужно чтобы это было видно как в макете.
Ваш вопрос
Lunacy, макет 1440, скопировал CSS из панели кода и открыл файл,а вместо страницы просто текст, что еще ему нужно чтобы это было видно как в макете.
4.20
В Linked design облачного документа используются специальные подключения и код слоев из Export. Следуйте именно этому сценарию, если выбрали его.
Обычный CSS из панели Code не превращает макет в самостоятельную веб-страницу. Это описание оформления слоев, которому нужна HTML-структура. Если открыть сам файл CSS в браузере, увидеть текст его содержимого нормально: браузеру не дан документ с элементами, к которым следует применить правила.
Создайте HTML-файл, подключите таблицу стилей через link и добавьте элементы для нужных частей макета. Проверьте формат скопированного кода. Если это только объявления вроде width, height и background, их нужно поместить внутрь подходящего селектора. Если селекторы уже есть, классы или идентификаторы HTML должны с ними совпадать. Имена слоев в макете не создают такие элементы автоматически.
Отдельно подготовьте ресурсы. Адрес изображения должен указывать на доступный файл, а выбранный шрифт необходимо подключить или заменить запасным. Координаты и фиксированные размеры из дизайнерского макета полезны как ориентир, но часто требуют переработки для страницы с меняющимся содержимым и шириной окна. Проверьте переносы текста и поведение блоков на телефоне, вместо того чтобы считать картинку шириной 1440 готовой адаптивной раскладкой.
У Lunacy есть и другой сценарий, Linked design для облачных документов. В нем из Export берут ссылку на CSS для head страницы и код нужных слоев для HTML. Изменения связанного дизайна могут отражаться на странице согласно этому механизму. Это отличается от простого копирования свойств из Code. Если используете Linked design, следуйте его полному порядку подключения и проверьте доступность внешних ресурсов. В любом варианте сам внешний вид не добавляет обработчики форм, навигацию и прочую логику приложения.
Что экспортировано CSS из панели Code описывает свойства выбранного слоя. Сам по себе файл со стилями не создает HTML-элементы и не является готовой страницей.
Минимальное подключение Создайте HTML с нужной структурой, подключите CSS через link и сопоставьте правила классам элементов. Если скопирован только список объявлений, поместите его внутрь селектора. Изображения и шрифты тоже должны быть доступны по указанным путям.
Другой режим В облачных документах Lunacy есть Linked design с подключаемым CSS и кодом слоев. Это отдельный сценарий: используйте обе предусмотренные части в своей HTML-странице. Не смешивайте его с простым копированием свойств из Code. Адаптивную структуру и поведение интерфейса все равно нужно проверить.
Пока нет премиум-вопросов в подборке
Не нашли то, что искали?
Задайте свой вопрос
Лучший ответ
Датахакер
Датахакер
Как файл css из lunacy сделать рабочим?
Копировал только свойства одного слоя, теперь понятнее.