前端页面如何适应多种多样的浏览器呢？页面缩放时如何保证页面不变形的太夸张

Question

我写的页面一直在谷歌浏览器里测试，到了其他浏览器页面就变形了，明明在谷歌里用的是14px的字体到了火狐就看起来变大了许多。。。而且就算是在谷歌浏览器里面，缩放时也是挤成一团。。。搜索也搜不出类似的问题解决方法。。求助大家

Answer 1

可以看看阮一峰的自适应网页设计（Responsive Web Design）和Flex 布局教程：语法篇

Answer 2

那你需要了解下响式布局

Answer 3

字体可以用rem，布局可以用响应式布局或者flex布局

Answer 4

看这里：使用Flexible实现手淘H5页面的终端适配

Answer 5

设置根font-size，然后用rem

Answer 6

字体变大是因为火狐的默认字体为16px,缩小变形是因为你的盒子写的不规范

Answer 7

利用媒体查询 可以写多个css样式 不同宽度用不同的样式

Answer 8

你需要 amfe-flexible，就是上面 使用Flexible实现手淘H5页面的终端适配 的 npm 模块：

import 'amfe-flexible'

这一行代码解放了我。