CSS Noob 在布局和定位方面确实需要一些熟练的帮助

发布于 2024-09-30 04:24:34 字数 543 浏览 6 评论 0原文

可能的重复:
使用 CSS 堆叠 Div

我对 CSS 有点陌生,多年来一直在我的 html 中使用表格,我试图弄清楚如何嵌套 div 或将它们堆叠在 3 列布局的内容部分中。对于表格,我只需创建一个新的 TR,但如果我将另一个 div 浮动到内容行中,它将显示为与内容平行或垂直,而不是在其下方。还有另一种方法可以做到这一点还是我错过了 Divs 的要点?

  <div id="header">Header</div>
  <div id="leftcolumn">Left Column</div>
  <div id="content">Content</div>
  <div id="footer">Footer</div>

Possible Duplicate:
Stacking Divs with CSS

Im kinda new to CSS have been using tables for my html for years, Im trying to figure out how I can nest divs or stack them inside the content section of a 3 column layout. with tables I'd just do a new TR but if I float another div into the content line line it will appear parallel or vertically to content, instead of under it. is there another way to do this or am I missing the point of Divs here?

  <div id="header">Header</div>
  <div id="leftcolumn">Left Column</div>
  <div id="content">Content</div>
  <div id="footer">Footer</div>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

情话难免假 2024-10-07 04:24:34

如果您在 #content 中嵌套某些内容并对其应用 clear:both,那么它将出现在 #content 中的内容下方。

If you nest something inside #content and apply clear:both to it then it will appear beneath the content in #content.

乙白 2024-10-07 04:24:34

请参阅 Opera Web 标准课程中的以下文章:

See the following articles from the Opera Web Standards Curriculum:

葬シ愛 2024-10-07 04:24:34

要使浮动元素出现在另一个浮动元素下方,请在该元素上设置 clear: Both;

To have a floated element appear under another floated element, set clear: both; on that element.

难如初 2024-10-07 04:24:34

您最好在 http://doctype.com/ 上提问。

您需要使用 {clear:left} 规则清除浮动,或者直接删除浮动。了解内联元素和块元素之间的区别以及如何使用 display 属性来操作它们。

You might be better asking this on http://doctype.com/.

You need to clear your floats by using the {clear:left} rule or simply remove the floats. Read up on the the difference between inline and block elements and how you can manipulate them using the display property.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文