私はしばらくブートストラップを使用してきましたが、これを行うことはできません (ブートストラップなしで行う方法さえ知りません)。私がしたいのは、テーブルまたはdivのいずれかをインデントすることです。Bootstrap でこのようなことが行われているのを見たことがあります<li>
が、テーブルはありません。基本的に<th>
、タイトルであり、プロジェクトの名前の下にある表が必要です。インデントが必要な理由は、プロジェクトが他のプロジェクトに依存しているためです。そのため、別のプロジェクトの下にあるプロジェクトは、その親の少し右側に配置する必要があります (これは基本的にインデントですよね?)
2 に答える
階層を示唆する小さなインデントが必要な場合は、いくつかのオプションがあります。Bootstrap テーブルに固有のものではありません。
1 つ目は、必要なインデントのレベルごとに改行しないスペースをいくつか追加することです。これには、テーブルの html を乱すことなく、テーブル コンテンツを生成するコードによってスペースを追加できるという利点があります。テキストがセル内で折り返される場合、折り返された行がインデントされないという欠点があります。また、これらの目に見えない非分割スペースはすべて、コピー/貼り付けの驚きにつながる可能性があります。
<td> Indented Text</td>
<td> Indented More</td>
コードがテーブルの html を出力している場合、より良い解決策は、量を増やしてテーブル セルのパディングを変更することです。これには、ノンブレーク スペースの増分よりも細かく制御できるという利点があり、ラップされたテキストもインデントされます。ここでの欠点は、コードから html を発行しているため、レイアウトの調整が難しくなる可能性があることです。
<td style="padding-left:20px">Indented Text</td>
<td style="padding-left:40px">Indented More</td>
これはオフセットを使用して解決できますか? 状況やマークアップがどのように見えるかがわからない場合、手助けするのはやや困難です。
offset* クラスは要素に margin-left を追加します。多分それはあなたを助けるでしょうか?