おそらく私はあまりにも気難しいです。私はいくつかのテーブルにセルのパディングを入れたいが、他のテーブルではなく、すべての単一のtd要素を編集する必要はない。私はテーブルのcellpaddingプロパティを使用しないことを意味するhtml5に準拠させたいと思います。しかし、私はcellpaddingと同等のものを望んでいます。つまり、テーブル単位でテーブル全体のプロパティに適用できるものです。td要素を編集しないで一部のテーブルだけにhtml5準拠のセルパッディング
さらに複雑にするために、私は崩壊した罫線を必要とします。これは、セルスペーシングプロパティを使用してルールを外していると思います。私はそこで何ができるのですか？
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
.cell-pad th,.cell-pad td{padding:10px}
</style>
</head>
<body>
<p>Table without cellpadding:</p>
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with cellpadding:</p>
<table cellpadding="10">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with css:</p>
<table class="cell-pad">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
</body>
</html>
これらの問題は、CSSを使用して解決できます。細胞レベルで
table.table-big td {
padding: 10px;
}
table.table-collapse {
border-collapse: collapse;
}
table td {
border: 1px solid #333;
}<table class="table-big table-collapse">
<tr>
<td>foo</td>
<td>bar</td>
</tr>
</table>
<table>
<tr>
<td>Hello</td>
<td>World</td>
</tr>
</table>paddingデータと境界との間の間隔を作成するために使用することができます。
border-collapseは、罫線を折りたたんだり区切ったりするために使用できます。
これらのスタイルでクラスを作成することで、どのテーブルにどのスタイリングが適用されるかを直接制御できます。私の例では、2番目のテーブルにはスタイリングがありませんでした。
これがどのようにOPの問題を解決するかについての基本的な説明を提供する必要があります。これは、単なるコードよりも役に立ちます。 –