css – 如何在网页上创建两列？

我想在我的网页上有两列.对我来说,这样做的简单方法是使用表格：

<table>
   <tr>
      <td>
         Content of the first column.
      </td>
      <td>
         Content of the second column.
      </td>
   </tr>
</table>

我喜欢这个解决方案,因为首先它是正确的(它给出了我想要的),它也非常简单和稳定(我将永远有两列,无论我的窗口多大).很容易控制桌子的大小和位置.

但是,我知道人们不喜欢表格布局,据我所知,他们使用div和css.所以,我也想尝试这种方法.有人可以帮我吗？

我想要一个简单的解决方案(没有技巧)容易记住.它也需要稳定(因此不会意外地发生一列在另一列之下,或者它们重叠或类似).

解决方法

我建议看这篇文章

http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

请参阅4.并列专栏

要使两列(#main和#sidebar)并排显示,我们将它们浮动,一个在左边,另一个在右边.我们还指定列的宽度.

#main {
    float:left;
    width:500px;
    background:#9c9;
    }
    #sidebar {
    float:right;
    width:250px;
   background:#c9c;
   }

请注意,宽度之和应等于步骤3中#wrap的宽度.