pc端适配

关于pc端适配走了很多弯路。

现有设计图 1920

方案一:

1.使用postcss-pxtorem + amfe-flexible
2.创建postcss.config.js 文件

postcss.config.js配置如下

 module.exports = {
    plugins: {
        "postcss-pxtorem": {
            rootValue: 192, // 设计图尺寸
            propList: ["*", '!border'],
            unitPrecision: 4,//px变为rem后保留的小数位数
            minPixelValue: 2 //px小于2px时不替换为rem
        }
    }
}`

方案可行性： 不可行，因为谷歌浏览器最小字体大小12px，根据设计图配置rem 后 存在很多比12小的字体。这样造成了很多地方不能100%还原设计图。 rem只使用与移动端开发

方案二：

设计图1920，可视区域肯定是1200， 所有就有了720的安全距离，所以开发的时候设置最小宽度1200， 剩余的所有空间设置成安全距离(外边距) 。 然后严格按照设计尺寸进行开发，（px为单位进行开发）
方案可行性： 方案可行