私はおそらくあなたのほとんどがこれらのことをすべて知っていることを知っていますが、それでもおそらく、CSSのグリッドについてこれらのことを学び始めたばかりの私のような人々がいるでしょう。そして多分これらの質問は彼らにも役立つでしょう。
- グリッドシステムとは何ですか?
- グリッドシステムをピクセルとパーセンテージで計算する方法は?
- オフセットとは何ですか?オフセットを計算する方法は?
- グリッドシステムを使用する方が良いですか?
私はおそらくあなたのほとんどがこれらのことをすべて知っていることを知っていますが、それでもおそらく、CSSのグリッドについてこれらのことを学び始めたばかりの私のような人々がいるでしょう。そして多分これらの質問は彼らにも役立つでしょう。
既にお気づきかもしれませんが、非常に多くの異なるグリッドと CSS フレームワークがあり、少し混乱する可能性があります。
グリッドは、セグメントに分割された画面の領域にすぎません。ほとんどのグリッドは通常、12 (または 12 の倍数) のグループに分割されます。したがって、コンテナーの幅が 960px で、12 個のグループ (列と呼びます) がある場合、各列の幅は 80px になります。
グリッドの計算は複雑になる可能性があり、ガター、オフセット、マージン、ネスト、コンテナーなどの追加と組み合わせると、css がすぐに乱雑になる可能性があります。
グリッド ベースの CSS フレームワークは数多くありますが、最も人気のある 2 つは Twitter の BootstrapとZurb の Foundation です。これらの 2 つは、ブループリント CSS や 960 グリッドなどよりも人気が高まっていると思います。これらは幅広いプラグインと、見栄えの良いレスポンシブな Web サイトを構築するための足場層を提供するからです。
お役に立てれば。