列中途有第二个标题的 HTML 表格?

标签 html css html-table

是否可以像下面这样在 html 中制作一个单个表格?我意识到可以将它变成两个单独的表,但我不想这样做,因为我希望这些表完美排列(一个直接在另一个下面。)

下面的可能吗?

SINGLE TABLE:
           Title 1
————————————————————————————————
|       |                      |
|       |                      |
|       |                      |
|       |                      |
|       |                      |
————————————————————————————————
           Title 2
————————————————————————————————
|       |                      |
|       |                      |
|       |                      |
|       |                      |
|       |                      |
————————————————————————————————

最佳答案

这样就可以了..

In your CSS add ..
th {
  text-align: center;
  background: pink;
}

在您的 HTML 中添加。

<table>
       <tr>
     <!----><th colspan="2">title 1</th>
       </tr>
        <tr>
            <td>row 1.1</td>
            <td>row 1.2</td>
        </tr>
        <tr>
            <td>row 2.1</td>
            <td>row 2.2</td>
        </tr>
       <tr>
     <!----><th colspan="2">title 2</th>
       </tr>
        <tr>
            <td>row 3.1</td>
            <td>row 3.2</td>
        </tr>
        <tr>
            <td>row 4.1</td>
            <td >row 4.2</td>
        </tr>
    </table>

只需添加 <th></th>你想要标题行的地方..

编辑
向表头添加标签。加上 @Paulie_D 建议的居中 CSS。

关于列中途有第二个标题的 HTML 表格?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39494401/

相关文章:

javascript - 单击 <a> 时隐藏 <p> 并显示 &lt;textarea&gt;

javascript - 点击外部导航关闭

PHP 动态表数据结果垂直而不是水平

javascript - 在 javascript 中创建了 SVG,但它不会连接到 CSS 或显示在浏览器中。任何解决方案?

javascript - 如何根据名称对表格进行排序

css - 我怎样才能让 Chrome 和 Firefox 对待围绕 float 的表格相同?

html - 如何向导航栏的每个 "section"添加文本?对于首页 x 文本显示,对于历史 : y text shows?

PHP用按钮插入MySQL

javascript - 如何使用 jQuery 或 Javascript 沿对 Angular 线滚动

宽度为 100% 的 Html 表格不适用于长文本