Question

我遇到了表格样式的奇怪问题。代码中至少对我来说似乎都很好。但效果是出乎意料的。

我必须保留0.3em的保证金，因为这是我的学生任务，但我不希望底部的行分开。

任何网站站长都可以提供帮助吗？我会非常感激。这是我的代码的和平：

<table>
<tr>
<td>Kategoriasystematyczna</td>
<td>Takson</td>
</tr>
<tr>
<td>Domena</td>
<td>eukarionty</td>
</tr>
<tr>
<td>Królestwo</td>
<td>zwierzęta</td>
</tr>
<tr>
<td>Gromada</td>
<td>ssaki</td>
</tr>
<tr>
<td>Podgromada</td>
<td>ssakiżyworodne
<td>
</tr>
<tr>
<td>Infragromada</td>
<td>łożyskowce
<td>
</tr>
<tr>
<td>Rząd</td>
<td>parzystokopytne
<td>
</tr>
<tr>
<td>Rodzina</td>
<td>żyrafowate
<td>
</tr>
<tr>
<td>Rodzaj</td>
<td>Giraffa(Brünnich,1771)
<td>
</tr>
<tr>
<td>Gatunek</td>
<td>żyrafa
<td>
</tr>
</table>

和风格

td{
border:1pxsolidblue;
margin:0.3em,0.3em,0.3em,0.3em;
}
table{
border:1pxsolidblue;
border-collapse:collapse;
}

这就是我的表格的样子

table

任何？ Antyhing？

Answer 1

你有开始标签而不是关闭标签td：

更改

<td>Gatunek</td>
<td>żyrafa
<td>

到

<td>Gatunek</td>
<td>żyrafa
</td>

在各个地方

Answer 2

正如我对您的答案的原始评论中所提到的（在删除冗余之前），问题是未关闭的<td>元素的语法错误（可能是拼写错误），纠正您的HTML修复了问题。更正了HTML：

<table>
    <tr>
        <td>Kategoriasystematyczna</td>
        <td>Takson</td>
    </tr>
    <tr>
        <td>Domena</td>
        <td>eukarionty</td>
    </tr>
    <tr>
        <td>Królestwo</td>
        <td>zwierzęta</td>
    </tr>
    <tr>
        <td>Gromada</td>
        <td>ssaki</td>
    </tr>
    <tr>
        <td>Podgromada</td>
        <td>ssakiżyworodne</td>
    </tr>
    <tr>
        <td>Infragromada</td>
        <td>łożyskowce</td>
    </tr>
    <tr>
        <td>Rząd</td>
        <td>parzystokopytne</td>
    </tr>
    <tr>
        <td>Rodzina</td>
        <td>żyrafowate</td>
    </tr>
    <tr>
        <td>Rodzaj</td>
        <td>Giraffa(Brünnich,1771)</td>
    </tr>
    <tr>
        <td>Gatunek</td>
        <td>żyrafa</td>
    </tr>
</table>

JS Fiddle demo

此外，您的CSS存在问题，您在margin属性值的值之间使用逗号，并且没有用于分隔边框属性的空格;固定，它应该看起来像：

td {
    border: 1px solid blue;
    margin: 0.3em;
}
table {
    border: 1px solid blue;
    border-collapse: collapse;
}

css造型表边框看起来很奇怪

2 个答案: