使用flexible.js实现可伸缩布局方案的方法，自动将px转换为rem并进行移动端适配
要使用flexible.js实现可伸缩布局方案，首先需要在项目中引入flexible.js文件。然后，设置meta标签中的viewport属性，使其宽度等于设备宽度除以缩放比例。接下来，在CSS中使用rem作为单位，并设置根元素的字体大小为屏幕宽度除以设计稿宽度的比例。最后，根据需要调整其他元素的字体大小和布局。 例如： ```html
这是一个可
flexible.js介绍
flexible.js是一款可伸缩布局方案，可以使网站内容适应屏幕大小的插件，主要功能就是自动将px转rem及rem单位，适配移动端。
下载地址：https://GitHub.com/amfe/lib-flexible
使用方法
直接引用，自动识别屏幕大小，自动动态变化font-size大小。
<metaname="viewport"content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"><scriptsrc="./node_modules/amfe-flexible/index.js"></script>
默认分为 10等份 ，即@baseFont大小为 750/10 = 75px;，例如要转化为1rem=80px；将index.js中的10改为24，因为1920/24=80。
相关文章
-
无相关信息
评论
