新手救助：js怎样实现如下图的界面布局？

如题，界面要自动适应设备屏幕大小！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！

$(document).ready(function () {
resizeEle($('div:first'), 80, null);//默认自适应，距屏幕底部80px
$(window).resize(function () { resizeEle($('div:first'), 80, null); });//换屏自适应
});

//内容自适应窗口大小
function resizeEle(ele, isResetH, IsResetW) {
var windowWidth = getPageSize()[2];
var windowHeight = getPageSize()[3];
if (isResetH !== null)
$(ele).css("height", (windowHeight - isResetH) + "px").addClass('overflowY');
if (IsResetW !== null)
$(ele).css("width", (windowWidth - IsResetW) + "px");
}

使用css不就行了吗

bootstrap.css栅栏系统

就是做适配操作了。如果你是pc端和移动端一起的话，可以使用boostrap去布局；如果单纯地手机端的话，可以引入淘宝基础js去进行样式计算布局，当然也可以自己去根据媒体查询去做一个基础css比例

给html设置font-size:100px ,然后使用rem即可 100px=1rem

你说的是图片吧 只有图片才会出现这个问题为你的图片加样式例如< img src="../img/fangshan.jpg" style="height:auto; width:auto\9; width:100%"/ >加上后可以直接根据屏幕大小计算图片尺寸

把单位换成rem的就能自动缩放

你查询下rem 原理 你就应该会知道怎么定义了