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

标签 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>

最佳答案

您可以简单地使用:

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

或者使用:

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

查看工作片段:

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

关于html - 设置最内层 html 元素的高度和宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32809820/

相关文章:

javascript - 如何更改嵌入式 Youtube 视频的速度

javascript - 在android中链接样式表文件

html - : 以下内容涵盖的 Bootstrap 下拉菜单内容

jquery - 上下颠倒的垂直 CSS 条形图

javascript - HTML 导航链接复制表单通过单击图像按钮提交

css - jstree:约束宽度

javascript - 在同一网页上显示谷歌图表和仪表

javascript - JQuery 移动返回 NaN

javascript - 使文本框中的默认值在使用 jQuery 输入文本之前不会更改

javascript - 单击按钮时如何更改javascript中的调用类?