css控制div的高度与浏览器的高度相适应
5个回答
展开全部
一、首先创建或打开我们的web项目并创建一个新的html文件和css文
二、HTML页面代码如图所示。定义一个div并给出一个id属性。
三、使用宽度百分比后，将高度值设置为零，使用padding属性的top或者bottom（可以使用任何百分比），并使用背景色作为测试。
四、浏览器运行后，效果如下。如果放大或缩小，宽度和高度将相应更改。
五、此方法是使用表达式设置高度。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
1、首先创建或者打开我们的web项目，新建一个html文件和css文件即可。
2、html页面代码如图所示，定义一个div，给一个id属性即可。
3、这里是使用宽度的百分比之后，设置高度值为零，使用padding属性的top或者bottom的值（可以是任意百分比），背景颜色作为测试。
4、然后在浏览器运行之后的效果是这样的哦，放大缩小浏览器，宽高会随之改变。
5、这个方法是使用expression来设置高度即可。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
高度的话 用css就不行了 用JavaScript先取得浏览器高度 然后设置一下
<script language="javascript">
var ss;
window.onload=function()
{
var w=document.documentElement.clientWidth ;//可见区域宽度
var h=document.documentElement.clientHeight;//可见区域高度
ss=document.getElementById('ha');
//alert(w);
ss.style.width=w+"px";
ss.style.height=h+"px";
}
<div id="ha" style="border:1px solid #000000;"></div>
<script language="javascript">
var ss;
window.onload=function()
{
var w=document.documentElement.clientWidth ;//可见区域宽度
var h=document.documentElement.clientHeight;//可见区域高度
ss=document.getElementById('ha');
//alert(w);
ss.style.width=w+"px";
ss.style.height=h+"px";
}
<div id="ha" style="border:1px solid #000000;"></div>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
一般这种情况是没办法实现的，
因为每个不同分辨率显示不一样，而且如果高度定成100%，
在不用分辨率中的显示页面上的东西肯定变形，或者撑不满，
我建议你没必要非得把高度定成跟浏览器一样的高度，希望我的答案您满意。
因为每个不同分辨率显示不一样，而且如果高度定成100%，
在不用分辨率中的显示页面上的东西肯定变形，或者撑不满，
我建议你没必要非得把高度定成跟浏览器一样的高度，希望我的答案您满意。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这种效果叫做遮罩，你可以百度一下，我贴个简单的给你：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>
<input type="button" onclick="pop()" value="弹出遮罩层" />
<input type="text" value="输入框" />
cccccccccccccccc
aaaaaaaaaaaa
bbbbbbbbbbbbbbbb
<script type="text/javascript">
<!--
function pop(){
var h=document.documentElement.clientHeight;
var w=document.documentElement.clientWidth;
var div=document.createElement("<div style='position:absolute;visibility:visible;border:1px solid #00f;z-index:2;left:0;top:0;width:"+w+"px;height:"+h+"px;'></div>");
div.appendChild(document.createTextNode("xxxxxxxxxxxxxxxxxxxx"));
document.body.appendChild(div);
}
//-->
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>
<input type="button" onclick="pop()" value="弹出遮罩层" />
<input type="text" value="输入框" />
cccccccccccccccc
aaaaaaaaaaaa
bbbbbbbbbbbbbbbb
<script type="text/javascript">
<!--
function pop(){
var h=document.documentElement.clientHeight;
var w=document.documentElement.clientWidth;
var div=document.createElement("<div style='position:absolute;visibility:visible;border:1px solid #00f;z-index:2;left:0;top:0;width:"+w+"px;height:"+h+"px;'></div>");
div.appendChild(document.createTextNode("xxxxxxxxxxxxxxxxxxxx"));
document.body.appendChild(div);
}
//-->
</script>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
