gpt4 book ai didi

html - 我可以在 css 中 float body 吗?

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

我不擅长整合,这太疯狂了。我漂浮了很多我的东西,发现每当我开始漂浮某物时,我必须漂浮它的容器和它的容器容器 ad nauseum,否则容器就会折叠。

所以现在看看我的网站,它非常稳定,但是如果我在 body 上加一个边框,我会看到它的顶部有 1px 高,body 中的所有内容都在外面。如果我漂浮 body 那么一切看起来都不错但是:

1- 那个设计不好吗?我应该怎么做?

2- 如果没问题,我该如何居中 body ?我使用 margin :自动。但是一旦 body 漂浮起来,它就会停止工作。

这是我的 CSS。

    body {
width: 960px;
font-size: 13px;
margin: auto;
margin-top: 20px;
border: 1px #000 solid;
}

.wrapper {
float: left;
width: 960px;

}

.header {
float: left;
width: 960px;
border: 1px #000 solid;
margin-bottom: 20px;
}

.menu {
width: 960px;
float: left;
border: 1px #000 solid;
}

.sidebar {
width: 260px;
float: left;
margin-top: 20px;
margin-left: 20px;
}

.content {
border: 1px #000 solid;
margin-left: 20px;
margin-top: 20px;
width: 620px;
float: left;
padding: 10px;
}

.footer {
border: 1px #000 solid;
width: 960px;
float: left;
margin-top: 20px;
}

布局文件:

<body> 
<div class="wrapper">
<div class="header">
<h1>HEADER</h1>
</div>
<div class="menu">
<ul>
<li><a href="/">Home</a></li>
</ul>
</div>
<div class="sidebar">
sidebar
</div>
<div class="content">
<h1>Content</h1>
</div>
<div class="footer">
<h1>FOOTER</h1>
</div>
</div>
</body>

无论如何希望我清楚。

最佳答案

.wrapper 中用 overflow: auto 替换 float ,它应该可以正常工作。然后,您可以使用 margin: auto 将其居中:

.wrapper {
overflow: auto;
margin: auto;
width: 960px;
}

此外,从 body 中删除 width: 960pxmargin: auto 因为你不再需要它们了。

关于html - 我可以在 css 中 float body 吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3568610/

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