Question

我希望它有一个半红半蓝的表，边框和文本之间有一些填充。我只是无法弄清楚为什么padding属性不适用于此

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> Practice Exercise </title
<style>
.red{background-color:red}
.blue{background-color:blue}
table{border-collapse:collapse;padding:40px;}
</style>
</head>
<body>
<table border ="1">
<tr>
<th class="red"> State </th>
<th class="blue"> Capital </th>
</tr>
<td class="red"> Utah </td>
<td class="blue"> Salt Lake City </td>
</tr>
<td class="red"> Texas </td>
<td class="blue"> Austin </td>
</tr>
<td class="red"> Tennesse </td>
<td class="blue> Nashville </td
</tr>
</table>
</body>
</html>

Answer 1

你的标记中有很多错别字：我会指出他们一切。

<table border="1">
    <tr>
        <th class="red">State</th>
        <th class="blue">Capital</th>
    </tr>
    <tr> <!-- missing -->
        <td class="red">Utah</td>
        <td class="blue">Salt Lake City</td>
    </tr>
    <tr> <!-- missing -->
        <td class="red">Texas</td>
        <td class="blue">Austin</td>
    </tr>
    <tr>  <!-- missing -->
    <td class="red">Tennesse</td>
    <td class="blue">Nashville</td>  <!-- missing one " after blue, and one > after </td -->
    </tr>
</table>

另外：您在table上应用了填充，您应该将其应用于td, th，如下所示：

<强> CSS

td, th
{
    padding: 5px;
}

Working Fiddle

填充属性不适用？

1 个答案: