ホームページ > 記事 > ウェブフロントエンド > CSS3 で異なる幅の列を作成するにはどうすればよいですか?
CSS3 での異なる列幅の指定
CSS3 の複数列レイアウトは、複数列レイアウトを作成する便利な方法を提供しますが、そうではありません。さまざまな列幅を指定できます。
この例では、1 つの列の幅が 20 ピクセル、もう 1 つの列の幅が 80 ピクセルである 2 列のレイアウトが必要です。
<code class="css"><div style="-webkit-column-count: 2; -webkit-column-rule: 1px solid black; -webkit-column-width: 80px; margin-left:20px;margin-top:20px;"> <div id="picturebox" style="">picture box</div> <div id="nme">name</div> </div></code>
これは次のとおりです。不可能です。 -webkit-column-width プロパティは、すべての列の幅を均等に設定します。この制限の理由は、複数列レイアウト機能が、一貫性とバランスの取れたレイアウトを維持しながら、等しい列間を流れるコンテンツ向けに設計されているためです。
したがって、目的の効果を達成するには、複数の列を使用するなどの代替アプローチが必要です。 div または float 手法の方が適切な場合があります。
以上がCSS3 で異なる幅の列を作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。