怎么用jQuery/HTML/Div+CSS按浏览器屏幕大小自适应布局？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了怎么用jQuery/HTML/Div+CSS按浏览器屏幕大小自适应布局？相关的知识，希望对你有一定的参考价值。
布局按全屏布局，浏览器窗口多大，内容网页就是多大
少用 JS 多用 CSS, 提升运行效率. 另外 resize 事件当用鼠标拖放窗口大小时, 触发非常频繁, 谨慎使用.
建议 body 下 布局一个 DIV, 这个DIV 的 CSS 可以这样处理:
position: absolute;
left:0px;
right:0px;
top:0px;
bottom:0px;
overflow:auto;
然后再在这个 div中进行布局, 子div可以用 100%相对布局, 页面宽度就自动撑开了.
另外一种常用布局是用 table 设置宽度为100%进行布局, 不过有很多局限, 用的少了.
参考技术A那要看你具体的布局方案。
$(function()var winWidth,winHeight;
Resize = function()
winWidth = $(window).width(),
winHeight= $(window).height();
);<body onResize="Resize()" onLoad="Resize()">
解释，Resize函数是当屏幕大小改变（包括载入）的时候对你需要的宽度和高度再赋值，我写的函数里只有拿到了窗口的宽度和高度，你要赋给谁自己确定，自适应布局的话基本也就是那么处理了。
参考技术B 做网站让页面自适应大小方法代码如下：一、电脑站设置网站自适应方法
全屏宽度主要在于CSS代码中，将width为100%，而不是一个固定的像素值，代码如下。
手机网设置网自适应方法：
在网页头部加上这样一条meta标签：<meta
name="viewport" content="width=device-width, initial-scale=1.0,
minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
解释：
width=device-width ：宽度等于设备屏幕的宽度。
initial-scale=1.0：表示：初始的缩放比例。
minimum-scale=0.5：表示：最小的缩放比例。
maximum-scale=2.0：表示：最大的缩放比例。
user-scalable=yes：表示：用户是否可以调整缩放比例。 参考技术C 用%分号 以下是代码请供参考!
style="width:100%;height:99.3%;" 参考技术D 100%是全屏的，如果你不需要100%全屏的那么久需要按照当前浏览器窗口大小去改变div大小，那么需要用到jq追问
就是按照当前的浏览器窗口的大小改变div大小，我成绩用过jQuery但是不怎么稳定，可能是我用错了，可以给以实例吗？谢谢您！
追答<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="
<head>
<title>无标题页</title>
<script src="
<script type="text/javascript">
$(function()
$("#a").width($(window).width()/2)
$("#a").height($(window).height()/2)
$(window).resize(function()
$("#a").width($(window).width()/2)
$("#a").height($(window).height()/2)
);
);
</script>
<style type="text/css">
div border:1px solid #ccc; margin:0 auto;
</style>
</head>
<body>
<div id="a"></div>
</body>
</html>
你试试这个代码，这个代码只是获取当前浏览器窗口复制给div然后除以2.也就是说当前div宽度和高度都是当前浏览器窗口的一半，你具体要div是多少宽度高度，看你具体需要去订，到时候赋值一下就可以了
以上是关于怎么用jQuery/HTML/Div+CSS按浏览器屏幕大小自适应布局？的主要内容，如果未能解决你的问题，请参考以下文章
jQuery 怎么实现JavaScript中的innerHTML功能
怎么用javascript/jquery在当前页面获取动态添加的表单的name和值并且变成整个数组
css id下第一个层怎么选择? 如:<div id="box"> <div></div> <div></di
div 怎么用jquery嵌入页面"chart.jsp" <div> 中间这块怎么写啊 求助 </div>