身高是100％？

我会asp.net网页就像一个风格：身高是100％？

body 
    { 
     font-family: Times New Roman, Serif; 
     color: #000000; 
     text-align: center; 
     min-height:100%; 
     height:auto; 
    } 
    #container 
    { 
     /*background-color: #00CCFF; */ 
     margin: auto; 
     width: 100%; 
    } 
    #header 
    { 
     /* background-color: #FF00FF; */ 
     width: 100%; 
     height: 95px; 
     background-image:url('../Images/Back_logo.png'); 
     background-repeat:repeat-x; 
     background-color:Transparent; 
    } 
    #menu 
    { 
     /*background-color: #FFFF00; */ 
     height:40px; 
    } 
    #left 
    { 
     /* background-color: #00FF00; */ 
     width: 20%; 
     float: left; 
    text-align:left; 
     border:1px solid #C8E3F1; 
     background-color:#EEFFFF; 
     overflow:hidden; 
    } 
    #center 
    { 
     width: 79%; 
     float: right; 
     /* background-color: #FF0000; */ 
    } 
    #footer 
    { 
     /*background-color: #008000; */ 
     clear: both; 
     height:70px; 
     margin-top:10px; 
     background-image: url('../Images/footer.png'); 
     background-repeat:repeat-x; 
     background-color:Transparent; 
    }

我有一个问题是页面并非100％的高度。我在身体使用最小高度或高度是100％，但不起作用。页脚由内容变更中心。怎么修？的HTML是非常简单的：

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="layout.master.cs" Inherits="layout" %> 

<!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"> 
    <head runat="server"> 
    <title>Layout</title> 
    <asp:ContentPlaceHolder id="head" runat="server"> 
    </asp:ContentPlaceHolder> 
    <link href="App_Themes/theme1/custom.css" rel="stylesheet" type="text/css" /> 
    </head> 
    <body> 
    <form id="form1" runat="server"> 
     <div id="container"> 
     <div id="header">HEADER</div> 
     <div id="menu">MENU</div> 
     <div id="left">LEFT</div> 
     <div id="center"> 
      <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server"</asp:ContentPlaceHolder> 
     </div> 
     <div id="footer">FOOTER</div></div> 
    </form> 
    </body> 
</html>

在其它页面中使用该母版页，在div有ID为中心可以拉伸或收缩属于它的包含。因此页脚的显示不准确。

来源

2011-09-13 PhamMinh

试试这个 http://stackoverflow.com/questions/4954147/css-100-height-in-ie – Nalaka526

我仍然有一个问题，页脚必须始终位于中心下方，这可以改变尺寸。 – PhamMinh

使用HTML，身体

html, body { 
height: 100%;

}

#footer 
{ 
    /*background-color: #008000; */ 
    clear: both; 
    height:70px; 
    position:absolute; 
    bottom:0px;  
    margin-top:10px; 
    background-image: url('../Images/footer.png'); 
    background-repeat:repeat-x; 
    background-color:Transparent; 
}

我们需要付出100％的高度，以HTML和body标签都。这经常被忽略，但是非常重要，因为没有元素会调整到百分比高度，除非它知道它目前占据的父级高度。由于容器是body标签的后代，它是html标签的后代，因此这是必需的。

100％的高度是CSS不那么容易做到的事情之一。当指定一个元素的高度为100％时，100％指的是包含元素的高度。那么包含元素将需要是其包含元素的高度的100％，等等。诀窍是设置最外层元素的高度为100％

来源

2011-09-13 09:43:20

页脚，如果中心不够长，如何将它固定在屏幕底部，如果中心div长于屏幕高度，则拖动它以修复它？ – PhamMinh

例如，您可以使用许多技巧进行游戏。将页脚的位置设置为绝对和底部：0px;还有很多其他的方法。 –

如果将页脚设置为绝对值，当中心点包含的长度高于屏幕高度时，它不起作用。页脚不能总是在页面下方。我使用固定位置，但不工作。 – PhamMinh

把html { height: 100% }放在开头，看看它是否有帮助。

来源

2011-09-13 09:41:58 Leonid

身高是100％？

回答

相关问题