【问题标题】:Setting the height and width of inner most html element设置最里面的html元素的高度和宽度
【发布时间】:2015-09-28 00:20:33
【问题描述】:

如本例所示,最里面的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>

【问题讨论】:

    标签: html


    【解决方案1】:

    你可以简单地使用:

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

    或使用:

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

    查看工作中的 sn-ps:

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

    【讨论】:

    • 什么?我不确定您对“协议”的含义是什么! @GRC。
    【解决方案2】:

    我认为你可以使用:

    div_name {宽度:100wv;高度:100wh;}

    wv ==> wievport 宽度

    wh ==> wievport 高度

    【讨论】:

    • 这是一个很好的例子,不幸的是我发现它适用于某些浏览器而不适用于其他浏览器。
    【解决方案3】:

    回答你的问题:

    % ==> 定义包含块的百分比高度

    所以当 height=100% 时你不能这样做,因为 100% 与父块相关,但你可以使用 px、em、wh 和 vw 来做到这一点。我要做的是将 body height 设置为 min-height,将大多数内部 div min-height 设置为相同的高度。

    旁注: 您不需要对 body 元素执行 height = 100%width = 100%。默认情况下,它们已经 100%。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-08-13
      • 1970-01-01
      • 2016-03-17
      • 1970-01-01
      • 2018-06-08
      • 1970-01-01
      • 2015-02-15
      • 1970-01-01
      相关资源
      最近更新 更多