gpt4 book ai didi

html - 你如何制作页眉端主布局

转载 作者:行者123 更新时间:2023-11-28 13:34:41 25 4
gpt4 key购买 nike

我想知道你们是如何在 html 中制作 header-side-main-footer 布局的。

像这样:

<html>
<div class="header"></div>
<div class="content">
<div class="side"></div>
<div class="main"></div>
</div>
<div class="footer"></div>
</html>

div.headerdiv.footer 具有固定的高度。 div.content 将保持所有剩余高度,主体没有滚动条。

并且 div.side 将具有固定宽度,而 div.main 将保持所有剩余宽度。

div.side 可以有 y 滚动条。

当窗口调整大小时,div.content 将展开以固定高度,没有滚动条。

顺便说一句,有时 div.sidediv.main 可能会像这样交换位置:

<html>
<div class="header"></div>
<div class="content">
<div class="main"></div>
<div class="side"></div>
</div>
<div class="footer"></div>
</html>

你是怎么做到的?

更新:

div.main 不能设置为 overflow:hidden,因为它是我用来创建 map 的容器。

var map=new google.maps.Map('main',{});

最佳答案

div.side 一个高度和宽度然后 overflow:scroll喜欢:

div.side{
height:60%;
width: 60%;
overflow: scroll;
}

div.content overflow:hidden

关于html - 你如何制作页眉端主布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13122856/

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