Question

我是html的新手，想知道如何在桌子内部制作边框？我想要做的就是：

当然我已经制作了一些代码来告诉你我正在努力使我的表看起来像那样，但是我能做的就是：

我在第二张图片中显示的代码在这里：

<table border="4">
     <caption>Table - 6 -</caption>
        <tr>
            <th rowspan="2">Item 1</th>
            <td>Item 2</td>
            <td>Item 3</td>
            <td>Item 4</td>
        </tr>
        <tr>
            <td>Item 5</td>
            <td>Item 6</td>
            <td>Item 7</td>
        </tr>

</table>

我正在尝试在网页中不使用CSS 。我想更多地了解HTML。

Answer 1

没有CSS，唯一具有原生边框的HTML元素是table和img。我在这里使用嵌套表：

＆＃13;

<table border="4">
     <caption>Table - 6 -</caption>
        <tr>
            <th rowspan="2"><table border="4"><tr><td>Item 1</td></tr></table></th>
            <td>Item 2</td>
            <td>Item 3</td>
            <td>Item 4</td>
        </tr>
        <tr>
            <td>Item 5</td>
            <td>Item 6</td>
            <td>Item 7</td>
        </tr>
</table>

＆＃13;

你真的不想在实际的网站上这样做，因为HTML不应该用于演示，只有CSS。

Answer 2

您可以将“第1项”放在<span>元素中并设置范围：

<table border="4">
     <caption>Table - 6 -</caption>
        <tr>
            <th rowspan="2"><span style="border:2px solid black;">Item 1</span></th>
            <td>Item 2</td>
            <td>Item 3</td>
            <td>Item 4</td>
        </tr>
        <tr>
            <td>Item 5</td>
            <td>Item 6</td>
            <td>Item 7</td>
        </tr>

</table>

请参阅小提琴：https://jsfiddle.net/tfs4f8sd/

请注意，我使用了内联CSS。只需给你想要一个内部边框的元素一个类名，并在CSS中设置它的样式。

如何在表格内部制作边框？

2 个答案: