12.5K ·GitHub
Что это такое?
lib-flexible (amfe-flexible) — устаревшая библиотека для вёрстки мобильных веб-страниц, которая динамически задаёт корневой font-size в зависимости от ширины экрана устройства, так что элементы, заданные в rem, масштабируются пропорционально на разных экранах.
lib-flexible (amfe-flexible) — устаревшая библиотека для вёрстки мобильных веб-страниц, которая динамически задаёт корневой font-size в зависимости от ширины экрана устройства, так что элементы, заданные в rem, масштабируются пропорционально на разных экранах.Это фреймворк или просто небольшой служебный скрипт?Это небольшой JavaScript-сниппет/библиотека, а не фреймворк: она лишь задаёт корневой font-size HTML-страницы при загрузке, а отдельный инструмент сборки (postcss-adaptive) преобразует значения px в вашем CSS в rem.
Это небольшой JavaScript-сниппет/библиотека, а не фреймворк: она лишь задаёт корневой font-size HTML-страницы при загрузке, а отдельный инструмент сборки (postcss-adaptive) преобразует значения px в вашем CSS в rem.Как подключить это к проекту?Установите через npm, затем импортируйте или встройте скрипт в страницу так, чтобы он выполнялся до загрузки вашей таблицы стилей.
Установите через npm, затем импортируйте или встройте скрипт в страницу так, чтобы он выполнялся до загрузки вашей таблицы стилей.Нужны ли дополнительные инструменты сборки, чтобы использовать rem в CSS?Вы пишете CSS с обычными значениями px и используете плагин PostCSS postcss-adaptive во время сборки, чтобы автоматически преобразовать их в rem.
Вы пишете CSS с обычными значениями px и используете плагин PostCSS postcss-adaptive во время сборки, чтобы автоматически преобразовать их в rem.Это до сих пор рекомендуемый способ верстки мобильных страниц?Нет. В README прямо сказано, что проект следует считать устаревшим, так как большинство браузеров теперь поддерживают единицы вьюпорта (vw/vh), и рекомендуется перейти на задание размеров относительно вьюпорта.
Нет. В README прямо сказано, что проект следует считать устаревшим, так как большинство браузеров теперь поддерживают единицы вьюпорта (vw/vh), и рекомендуется перейти на задание размеров относительно вьюпорта.Зачем вообще создали lib-flexible?Пока единицы вьюпорта CSS (vw/vh) не получили надёжной поддержки во всех браузерах, разработчикам нужен был способ заставить верстку на rem масштабироваться вместе с шириной устройства, поэтому команда AMFE из Alibaba создала этот скрипт корневого font-size как временное решение для адаптивной мобильной вёрстки.
Пока единицы вьюпорта CSS (vw/vh) не получили надёжной поддержки во всех браузерах, разработчикам нужен был способ заставить верстку на rem масштабироваться вместе с шириной устройства, поэтому команда AMFE из Alibaba создала этот скрипт корневого font-size как временное решение для адаптивной мобильной вёрстки.Стоит ли сегодня начинать с этим новый проект?Нет — поскольку в собственном README это явно помечено как устаревшее в пользу нативных единиц вьюпорта, новые проекты должны использовать CSS на основе vw/vh, а не добавлять эту зависимость.
Нет — поскольку в собственном README это явно помечено как устаревшее в пользу нативных единиц вьюпорта, новые проекты должны использовать CSS на основе vw/vh, а не добавлять эту зависимость.What are similar projects?fastclick, skrollr, responsive-html-email-template, material, vux, swiper, Respond, tailwindcss
fastclick, skrollr, responsive-html-email-template, material, vux, swiper, Respond, tailwindcssWhich topics is it in?responsive-web-design, postcss, front-end-development, mobile-web, alibaba, responsive, javascript-library, deprecated, css, china, mobile, web-development
responsive-web-design, postcss, front-end-development, mobile-web, alibaba, responsive, javascript-library, deprecated, css, china, mobile, web-development