html - 在 html 页面上排列项目

Question

自从我编写html以来已经有很长时间了。我的文档目前有一个包含在 div 标签中的谷歌图表。我希望在我的页面中添加一个组合框和文本框来操作图表后面的 js。以前我使用表格来组织页面上的项目，但今天它是如何完成的？

顺便说一句，我的 div 看起来像这样：

<div id="visualization" style="width: 600px; height: 400px;"></div>

score 2 · Accepted Answer

在 HTML 4 中，您可能希望使用 div 元素，然后为它们分配带有 ID 或类的样式：

<div id="mainContent>
     <div class="container">
         <!-- Content Here-->
     </div>
     <div class="container">

     </div>
</div>

CSS；这将为您提供 960 像素宽的居中页面，每个容器都有一个边框

html, body {text-align: center}
#mainContent {width: 960px; margin: 0 auto;}
.container {margin: 10px; border: 1px #000 solid}

要获得两列，您将使用以下内容.container

.container {margin: 10px 0 10px 10px; width: 465px; float: left}

每当你浮动某些东西时，你总是想给它一个特定的宽度，如果浮动元素的容器没有特定的高度，你会添加

<div style="height: 0; clear: both">&nbsp;</div>

否则容器不会延伸到浮动元素的底部，像这样

我将尝试找到更多布局内容并进行编辑。

编辑：使用 HTML 5 的主要区别在于它添加了header、footer和section. 在 HTML 4 中只有div.

编辑：

这是另一个关于在布局中使用浮动的不错的教程：

1 回答 1