代码之家 › 专栏 › 技术社区 › noamtm

html/css:将div bounding box设置为window height

css html

noamtm · 技术社区 · 16 年前

看来我错过了一些基本的东西。我想要一个有窗户的高度。其效果应该是永远不需要向下滚动。

我必须使用JavaScript吗?我被告知css有可能,但是我找不到相关的属性,或者我做错了什么。

5 回复 | 直到 16 年前

Strelok 16 年前

body { 
  margin:0; 
  padding:0; 
  height:100%; /* this is the key! */ 
}

.yourDivStyle {
  ...
  height: 100%;
}

hood 16 年前

如果要关闭滚动,请使用以下CSS:

html, body
{
overflow: hidden;
}

如果使用Javascript,请确保注册onresize事件,以便在调整窗口大小时更改数字。

reisio 16 年前

让所有的父母 height: 100%; position: absolute /* or fixed */; left: 0; top: 0; width: 100%; height: 100%; .

Sarfraz 16 年前

我必须使用JavaScript吗?我是告诉我用css是可能的,但是或者我做错了什么。

Javascript就是这样,你不能用css来确定winodow的大小,并根据窗口大小重新计算。

-1

Barrie Reader 16 年前

好的,所以在Javascript中(不是jQuery或其他任何东西):

<html>
<head>
<script type="text/javascript">
<!--

 var sWidth;
 var sHeight;


 if (typeof window.innerWidth != 'undefined')
 {
      sWidth = window.innerWidth,
      sHeight = window.innerHeight
 } else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
 {
       sWidth = document.documentElement.clientWidth,
       sHeight = document.documentElement.clientHeight
 } else
 {
       sWidth = document.getElementsByTagName('body')[0].clientWidth,
       sHeight = document.getElementsByTagName('body')[0].clientHeight
 }
//VARIABLES STORED IN sWidth AND sHeight
document.write('<div style="height: '+sHeight+'; width: '+sWidth+';">CONTENT</div>');
//-->
</script>
</head>
<body>

</body>
</html>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Jamie · 在CSS链接的文件名中添加Jinja占位符

1 年前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

1 年前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

1 年前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

1 年前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

1 年前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

1 年前