设置最内层html元素的高度和宽度

时间:2015-09-27 15:52:01

标签: html

如本例所示,最里面的 div 标记的高度和宽度设置为浏览器窗口的高度和宽度。如何在不通过css或内联样式属性设置所有父元素的高度和宽度的情况下设置相同元素的高度和宽度。

<!DOCTYPE html>
<html style="width:100%;height:100%;">

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body style="width:100%;height:100%;">
    <div style="wiidth:100%;height:100%;">
      <div style="width:100%;height:100%;">
        <div style="border: 2px solid #000000;width:100%;height:100%;">Innermost Div</div>
      </div>
    </div>
</body>
</html>

3 个答案:

答案 0 :(得分:3)

您可以简单地使用:

position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;

或使用:

position: absolute;
width: 100%;
height: 100%;

参见工作片段:

&#13;
&#13;
<div>
  <div>
    <div style="border: 2px solid #000000; width:100%; height:100%; position: absolute;">Innermost Div</div>
  </div>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:2)

我认为你可以使用:

div_name {width:100wv;高度:100Wh的;}

wv ==&gt; wievport宽度

wh ==&gt; wievport高度

答案 2 :(得分:1)

回答你的问题:

  

%==&gt;定义包含块

的高度(以百分比表示)

因此,如果高度= 100%,则无法执行此操作,因为100%与父块相关,但您可以使用px,em,wh和vw执行此操作。我要做的是将身高设置为最小高度,将大多数内部div最小高度设置为相同的高度。

侧面说明: 您无需在body元素上执行height = 100%width = 100%。它们已经100%作为默认值。