CSSグリッドフレームワークのガターのポイントは何ですか？
私はWeb開発に飛び込んでおり、グリッドシステムを含むBlueprint CSSフレームワークで遊んでいますが、いくつか質問があります。
- 側溝のポイントは何ですか？確かに、margin CSSプロパティを使用できるので、列の間にスペースを含めるために使用されていませんよね？それとも、側溝はマージンを管理するためのエレガントな方法ですか？
- 列の間にスペースを入れたくないので、ガターを含まないグリッドレイアウトを生成したいのですが、すべてのジェネレータツールにより、幅がゼロのガターができなくなります。何故ですか？
- 表示されます 推奨されるブループリントCSSジェネレーター はサポートされなくなりました。グリッドを変更して幅ゼロのガターを含めるためのブループリントCSSジェネレーターを提案できる人はいますか？
あなたの知恵をどうもありがとう！
CSSグリッドシステムの背後にある動機は、レイアウトを完全に自動化することです。列間の空白は読みやすさを向上させるため、ガターは通常望ましいので、自動化の一部としてそれらを含めることは理にかなっています。
Generatorの存在理由は、それらを実装するために必要な少し面倒な計算から解放することですが、ガターがなければ、数学とcssの両方はまったく複雑ではありません。
ジェネレータなしでガターなしのグリッドを作成するのは非常に簡単です。例えば.
( column width X nº of columns ) + left margin + right margin = content width
.span-1 {width:100px}
.span-2 {width:200px}
.span-3 {width:300px}
.span-4 {width:400px}
etc...
ガターはCSS自体とはまったく関係がありません。これらは印刷出版のデザインコンセプトです。列の間に空白を設けて、コンテンツを読みやすくすることを目的としています。
ガターのない列は非常に簡単に計算できます。各列に同じ幅をピクセル単位で設定するだけです。