网络平台ID：WEB_wysj (点选高度关注)  ◎    ◎   ◎  ◎ ◎◎◎◎◎一┳═┻︻▄

随著终端互联网的产业发展和QQ的凸起，终端端积极响应式产业布局愈来愈关键了。

现阶段中文网站产业布局有下列三种：

许多pc的中文网站都是定长度产业布局的，也是增设了min-width，

如此一来，假如小于那个长度就会再次出现快捷方式，

假如小于那个长度则文本德博瓦桑县另加大背景，

此种结构设计常用与pc端。

简而言之积极响应式产业布局就是INS13ZD产业布局+新闻媒体查阅，

INS13ZD产业布局用以化解相同长度的产业布局难题，

另加新闻媒体查阅，能调整产业布局，比如电视萤幕是产业布局1，小萤幕是产业布局2，

此种产业布局Junagadhpc和终端端，努力做到精巧处，二者的效果都很好，

缺点是新闻媒体查阅是有限的，也是能枚举出来的，

只能适应主流的宽高。

近期再次出现rem产业布局，参考：http://isux.tencent.com/web-app-rem.html

原理是，先按定高宽结构设计出来页面，然后转换为rem单位，

配合js查阅萤幕大小来改变html的font-size，

最终做出简而言之的完美自适应。

rem一出好像所有终端端自适应不采用rem都很low一样，

来分析分析，

假设以100×100做出页面，

那么采用rem+js完全能自适应所有200×200，300×300，450×450等等高宽，

难题来了，

假如用100×100结构设计好后，

来了100×200，100×300，100×400的手机，

1.页面文本只局限与页面顶部，比如100×400的手机，页面文本只占用的100×100的部分，

2.有人说能高度也js+rem，那么效果无非是拉伸或者缩放

有人会说了，现实中不会有100×400的手机，

我想说的是此种rem+js只不过是长度自适应，

高度没有努力做到自适应，一些对高度，或者元素见间距要求比较高的结构设计，

那此种产业布局没有太大的意义。

假如只是长度自适应，那我更推荐的是积极响应式结构设计。

随便找一个积极响应式的中文网站

改变浏览器长度，你会发现“产业布局”会随之变化，不是一成不变的，

比如导航栏在电视萤幕下是横排，在小萤幕下是竖排，在超小萤幕下隐藏为菜单，

也是说假如有足够的耐心，在每一种萤幕下都应该有合理的产业布局，完美的效果。

优点：适应pc和终端端，假如足够耐心，效果完美

缺点：要匹配足够多的萤幕大小，工作量不小，结构设计也需要多个版本

附图：

改变浏览器长度，你会发现，页面所有元素的高宽都等比例缩放，

也是电视萤幕下导航是横的，小萤幕下还是横的只不过变小了。。

优点：理想状态是所有萤幕的高宽比和最初的结构设计高宽比一样，或者相差不多，完美适应。

缺点：碰到重视高度的结构设计，或者重视元素间间距的结构设计，那就玩不开了。

附图：

1.假如只做pc端

那么定长度是最好的选择

2.假如做终端端，且结构设计对高度要求不高

那么rem+js是最好的选择，一份css+一份js调节font-size搞定

3.假如pc，终端要兼容，而且要求很高

那么积极响应式产业布局还是最好的选择，前提是结构设计根据相同的高宽做相同的结构设计，

积极响应式根据新闻媒体查阅做相同的产业布局。

【ps】

还有一种rem+新闻媒体查阅，和rem+js一对比感觉有点鸡肋就没有提及。

随著终端端风行，最完美的是：

积极响应式产业布局+多版本结构设计+足够的耐心