gpt4 book ai didi

javascript - 如何将固定高度的页眉与灵活的页面布局相结合

转载 作者:塔克拉玛干 更新时间:2023-11-02 22:38:44 26 4
gpt4 key购买 nike

问题:如何将固定高度与灵活的页面布局相结合?

  • "bodyDiv" height needs to be : 100% of ( window.innerWidth less ?px ).
  • "a" & "b" height need to be : 50% of ( body.div.height less ?px ).

<HTML>
<body>
<div id="headerDiv" style="height:?px">fixed height</div>
<div id="bodyDiv" style="height:100%">flexible height
<div id="a" style="height:50%">flexible height</div>
<div id="x" style="height:?px">fixed height</div>
<div id="b" style="height:50%">flexible height</div>
...
</div>
</body>
<HTML>

它已经在 J​​avaScript 中完全解决了,但它看起来很糟糕页面加载和调整大小事件,因为它太慢了,即使我已尽最大努力优化它以提高速度。

CSS 表达式也不是一个选项,因为对我来说无论如何,这些知识仅限于 IE 5-7。

因此,在花了 3 天时间尝试使用任何方法解决此问题之后负边距和正边距的组合,我终于不得不承认失败,最终寻求公众帮助。

最佳答案

冒着失去名誉的风险。

我建议这样做:

<table style="height:100%;width:100%">
<tr style="vertical-align:top;height:50px;background-color:#faa;">
<td>Fixed</td></tr>
<tr style="vertical-align:top;background-color:#afa;">
<td>Flexible</td></tr>
<tr style="vertical-align:top;height:100px;background-color:#faa;">
<td>Fixed</td></tr>
<tr style="vertical-align:top;background-color:#afa;">
<td>Flexible</td></tr>
</table>

这会冒犯布局 v 语义纯粹主义者,但它可以完成工作,并且可以节省您几天时间来处理 div 和 CSS。

P.S 这只是一个例子,样式实际上应该在外部样式表中并通过元素 ID 链接。

关于javascript - 如何将固定高度的页眉与灵活的页面布局相结合,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/614087/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com