html - 创建一个盒子，里面有一系列盒子，里面有文字

Question

我正在寻找一个盒子，里面有一系列盒子，它们都有自己的文本居中。我已经在油漆中创建了一个原型并拍摄了一个屏幕截图。有谁知道我怎么能用代码做到这一点？http://screencast.com/t/hFCxwKxxJi5

谢谢！

Answer 1

使用 的colspan属性td将文本扩展到多个单元格。

<table>
    <tr><td colspan="2">Some text here</td></tr>
    <tr><td>Next</td><td>Last</td></tr>
</table>

在样式中添加以下内容以使文本居中并绘制边框

<style type="text/css">
    table, td
    {
        padding: 3px 8px;
        border-collapse: collapse;
        border: 1px solid #000000;
        text-align: center;
    }
</style>

Answer 2

您可以使用<table>标签轻松完成。像这样 -

<table border="2">
  <tr><td colspan="2">Hello</td></tr>
  <tr><td>Hello 2</td><td>Hello 3</td></tr>
</table>

完毕。如果需要，您可以使用 CSS 对其进行样式设置。