Html 如何使文本定位在列中

我用CSS制作了一些专栏。我想知道是否可以将文本流到列中，以便文本如下所示：

th{边框：1px纯黑色；边框底部：无；}
td{边界塌陷：塌陷；}
标题
标题
内容
内容
内容
内容

请参见此处了解何时使用表格：

布局可以使用以下代码创建，但是如果您想

将文本溢出到两列中

，则需要查看Javascript/jQuery

HTML:

---

你为什么不想用桌子呢？它们似乎非常适合这种情况。@MathNerdProductions表格在这种情况下并不完美，表格应该只包含表格数据，而不包含内容。@AlexeiDarmin您知道答案链接到十多年前的帖子，对吗？这个问题本身已经有7年多的历史了。无论如何，在将来使用高效且易于修改的表并没有错。陷入麻烦的地方太多了：嵌套等等。@MathNerdProductions这是一篇老文章，但是它也包含了一个关于在不同条件下使用表的利弊的直截了当的论点。我承认表不会崩溃，但是表的最佳情况是div的最坏情况。两者的设置时间大致相同，而

div

s稍后更容易更改。哦，显然，

表格

不能很好地翻译成屏幕阅读器，但是我没有经历过。我知道它可以在小提琴上使用，但在我的网站上不起作用：。点击页面顶部的“教程和片段”。添加

字体大小：0pt

到

，它也适用于您的站点。

<div id="content">
  <div class="header">Header one</div>
  <div class="header">Header Two</div>

  <div class="quarter">Content One </div>
  <div class="quarter">Content Two</div>
  <div class="quarter">Content Three</div>
  <div class="quarter">Content Four</div>
</div>

#content{
  display:block;
  background-color:grey;
  width:80%;
  height:200px;
  margin:auto;
  font-size:0pt;
}

.header{
  display:inline-block;
  text-align:center;
  font-size:12pt;
  width:48%;
  margin:1%;
  background-color:yellow;
}

.quarter{
  display:inline-block;
  text-align:center;
  font-size:12pt;
  width:23%;
  min-height:40px;
  margin:1%;
  background-color:green;
}