純粋な CSS を使用して不特定の数のセルに対して同じ幅のテーブルセルを実現できますか?-CSSチュートリアル-php.cn

純粋な CSS を使用して不特定の数のセルに対して同じ幅のテーブルセルを実現できますか?

Susan Sarandon

リリース： 2024-11-08 15:03:01

オリジナル

474 人が閲覧しました

Can Equal Width Table Cells Be Achieved with Pure CSS for an Indeterminate Number of Cells?

セル数が不定の等幅テーブルセル

テーブルに予測できない数のテーブルセル要素が含まれるシナリオでは、コンテンツの変化に関係なく、純粋な CSS を利用してこれらのセルの幅を等しく設定します。サイズ?

答え:

はい、次の CSS 宣言を使用して可能です:

<code class="css">div {
  display: table;
  width: 250px;
  table-layout: fixed;
}

div > div {
  display: table-cell;
  width: 2%; /* or 100% if preferred */
}</code>

ログイン後にコピー

このソリューションではテーブルレイアウトが導入されています:固定; これは、各セルの指定された幅 (この例では 2%) と組み合わせて、指定された寸法を尊重しようとする特定のテーブルアルゴリズムをトリガーします。 OS X 上の Safari 6 では、table-layout:fixed; の非標準実装により、異なる結果が表示される可能性があることに注意してください。

以上が純粋な CSS を使用して不特定の数のセルに対して同じ幅のテーブルセルを実現できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。