ホームページ > ウェブフロントエンド > CSSチュートリアル > 純粋な CSS を使用して不特定の数のセルに対して同じ幅のテーブルセルを実現できますか?

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

Susan Sarandon
リリース: 2024-11-08 15:03:01
オリジナル
503 人が閲覧しました

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 サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート