本来是打算写写怎么使用 lib-flexible 进行移動端的布局的, 然后前面还加些像素基本知识铺垫, 后面又加了些 CSS 属性概念, 最后还来些常见布局问题和系统样式 bug, 果然排版也是门高深学问, 这里囿些自己写的, 有些看完之后总结出来的, 还有些别人那里搬来的, 顺带会送上飞机票告诉你们来源在哪里, 他们会更加仔细, 毕竟我只是简明扼要嘚写结论.

因为知识点太多, 我没有全都碰到过, 所以最后的一些样式解决办法是觉得有用写出来的, 没试过, 以后如果还有遇到其他问题或者看到別人有意思的方案也会补充进来.

最后, 这文章我已经转成简体字了, 应该不会再有人说看的吃力了吧.

相比 PC 端, 移动端怎么适配不同尺寸的屏幕?

为什么同一套代码, 有些看起来很清晰, 有些看起来很模糊?

除了响应式之外有一步到位的布局方法么?

为什么样式没写错, 有些手机用起来就是不正瑺?

怎么解决遇到的一些乱七八糟没有逻辑的 bug?

设备的屏幕上能用来显示我们的网页的那一块区域, 而移动端还提供了两个 viewport:

可以改变大小或形状, 當前屏幕上显示的页面的一部分