web-dev-qa-db-ja.com

余白を利用できるように、より良いレイアウトが必要

enter image description here

ここでは、すべてのサブジェクトに対して同じID、姓、名を繰り返したくないので、展開ボタンを使用しました。 -このアプローチにより、すべての行が折りたたまれた状態のときに表示される行の数が大幅に減少します。

しかし、ここでの1つの欠点は、件名の数が10だとすると、たくさんの空のスペース(赤い枠が付いている)が残されることです。したがって、この問題に対するより良い解決策が必要です。ポップアップはアプローチの1つですが、私はより良いアプローチを望みます。

15
Parag Bandewar

展開するときに、スコアリング情報を学生の行の下に小見出しとして表示してみてください。このようなもの。

enter image description here

新しい見出しのように見えるのではなく、展開された行の一部であることを明確にするために、小見出しをスタイルから削除するように注意する必要があります。

27
Jim

ジムの答えを微調整しています...

Tweak jim

...もう少し区別を付けます。子テーブルのボクシング。親テーブルのように水平ではなく、垂直線で列を区切ります。

Tonnyのコメントに触発されて、あなたの検討のためにいくつかのインデントされた例があります:

indent 1

indent 2

indent fav

21
bloodyKnuckles

少しわかりやすく、@ Bergiと@CoDEmanXの提案に従います。

enter image description here


元の:

行を展開すると、次のようになります。

enter image description here

ID、姓、名はすべてのサブジェクトに共通なので、情報は各行で繰り返されます。

これらの共通フィールドの繰り返しを防ぎ、テーブルレイアウトを変更しない1つの方法は、複数の列を表す単一のフィールドを使用することです。わかりやすくするために、各要素に境界線を追加することをお勧めします。

enter image description here

9
Alvaro