[解決済み] 同じ<table>の中に複数の<tbody>を入れることはできますか?
2022-03-16 15:57:30
質問
複数の
<tbody>
タグが同じ
<table>
? もしそうなら、どのようなシナリオで複数の
<tbody>
タグを使用できますか?
どのように解決するのですか?
例えば、私はこのように、データのグループをより簡単にスタイル付けするために使っています。
thead th { width: 100px; border-bottom: solid 1px #ddd; font-weight: bold; }
tbody:nth-child(odd) { background: #f5f5f5; border: solid 1px #ddd; }
tbody:nth-child(even) { background: #e5e5e5; border: solid 1px #ddd; }
<table>
<thead>
<tr><th>Customer</th><th>Order</th><th>Month</th></tr>
</thead>
<tbody>
<tr><td>Customer 1</td><td>#1</td><td>January</td></tr>
<tr><td>Customer 1</td><td>#2</td><td>April</td></tr>
<tr><td>Customer 1</td><td>#3</td><td>March</td></tr>
</tbody>
<tbody>
<tr><td>Customer 2</td><td>#1</td><td>January</td></tr>
<tr><td>Customer 2</td><td>#2</td><td>April</td></tr>
<tr><td>Customer 2</td><td>#3</td><td>March</td></tr>
</tbody>
<tbody>
<tr><td>Customer 3</td><td>#1</td><td>January</td></tr>
<tr><td>Customer 3</td><td>#2</td><td>April</td></tr>
<tr><td>Customer 3</td><td>#3</td><td>March</td></tr>
</tbody>
</table>
ここで例を見ることができます . これは新しいブラウザでしか動作しませんが、私の現在のアプリケーションでサポートしているもので、JavaScriptなどでグループ化を使用することができます。主なものは、データをより読みやすくするために、行を視覚的にグループ化する便利な方法だということです。もちろん他の使い方もありますが、適用できる例としては、この方法が私にとって最も一般的なものです。
関連
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] HTML5のlocalStorageにオブジェクトを格納する方法は?
-
[解決済み] jQueryでテーブルの行を追加する
-
[解決済み] XHTMLの自己完結型タグを除くオープンタグにマッチするRegEx
-
[解決済み] HTMLマークアップのどこに<script>タグを記述すればよいですか?
-
[解決済み] jQueryで名前を指定して要素を選択するには?
-
[解決済み] input type="date "のフォーマットを変更する方法はありますか?
-
[解決済み】enctype='multipart/form-data'とはどういう意味ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Uncaught TypeError: document.getElementsById は関数ではありません。
-
[解決済み] セレクトボックスのプレースホルダーを作成するにはどうすればよいですか?
-
[解決済み] divの内容を下に揃える方法
-
[解決済み] CSSでdivのアスペクト比を維持する
-
[解決済み] クリック可能なラベルを持つチェックボックスを作成するには?
-
[解決済み] 入力テキストボックスの値を取得する
-
[解決済み] ラジオボタンをデフォルトで選択するには?[重複しています]
-
[解決済み] HTML5で(非空白の)自己閉鎖タグは有効ですか?
-
[解決済み] CSSでdivを縦にスクロールできるようにする
-
[解決済み] 残りの幅を埋めるためにdivを展開する