随着智能手机的普及以及社会的发展，传统的网站布局已经无法适应现状，我们编写的网页不仅仅要展示在电脑上， 也要展示在移动设备上，而移动设备种类繁多，苹果、小米、三星等等很不好适配

移动端设备屏幕尺寸非常多，碎片化严重，Android和苹果设备有多种分辨率：480x800, 480x854, 540x960, 720x1280，1080x1920等

一般的电脑端的页面布局在手机上无法完全适应，那么如何让一个页面匹配各个分辨率的页面呢？

那么首先现在移动端有两种适配方案:

一 .单独制作移动端页面(主流)也就是说，PC端和移动端为两套网站，pc端是pc断的样式，移动端在写一套，专门针对移动端适配的一套网站

移动端单独制作的常见布局方式:

流式布局(百分比布局)

flex 弹性布局(强烈推荐)

less+rem+媒体查询布局

混合布局

比如百度pc端和移动端的官网:

pc端一套代码样式

移动端一套代码样式

二 .响应式页面兼容移动端即pc和移动端共用一套网站，