CSS div高度100%问题? [英] css div height 100% problem?

查看:109
本文介绍了CSS div高度100%问题?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我希望div占用所有屏幕高度,所以才找到以下链接:

I would like a div to take all the screen height, that's why I found the following links:

  • http://www.webmasterworld.com/forum83/200.htm
  • http://www.thefutureoftheweb.com/blog/100-percent-height-interface

技巧:使容器具有指定的高度,例如:body{height:100%}看起来可以正常工作,但是,我发现:一旦添加了一些doctype声明,例如:

the tricks: make the container have a specified height, for example: body{height:100%} seems work fine, however, I found that: once you add some doctype claim, for example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

它不起作用,至少在Firefox 3. *上不起作用.有什么建议吗?

It doesn't work, at least at Firefox 3.*, it doesn't work. Any suggestions?

推荐答案

以下内容适用于HTML 4.01严格版(来自您的第二个链接).即使body太长,也不会显示垂直滚动条.这对您有用吗?

The following works for me in HTML 4.01 strict (from your second link). No vertical scroll bar is displayed, even if the body is very long. Does this work for you?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <style>
      html, body {
      /* get rid of default spacing on the edges */
      margin: 0;
      padding: 0;

      /* get rid of that 2px window border in Internet Explorer 6 */
      border: 0;

      /* fill the height of the browser */
      height: 100%;

      /* no more scroll bar */
      overflow: hidden;
    }
    </style>
  </head>
  <body>
    <div>
      many many lines of text
    </div>
  </body>
</html>

这篇关于CSS div高度100%问题?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆