Bootstrap-grid-demo

ブートストラップ-グリッドデモ

グリッドとは何ですか？

'_グラフィックデザインでは、グリッドは、コンテンツの構造化に使用される一連の交差する直線（垂直、水平）で構成される構造（通常は2次元）です。 印刷デザインのレイアウトとコンテンツ構造の設計に広く使用されています。 Webデザインでは、HTMLとCSSを使用して一貫性のあるレイアウトを迅速かつ効果的に作成する非常に効果的な方法です。_

ブートストラップグリッドシステムの動作

グリッドシステムは、コンテンツを収容する一連の行と列を介してページレイアウトを作成するために使用されます。 ブートストラップグリッドシステムの仕組みは次のとおりです-

• 適切な配置とパディングのために、行は .container クラス内に配置する必要があります。
• 行を使用して、列の水平グループを作成します。
• コンテンツは列内に配置する必要があり、列のみが行の直接の子になります。
• グリッドレイアウトをすばやく作成するために、。rowや .col-xs-4 などの事前定義されたグリッドクラスを使用できます。 LESSミックスインは、よりセマンティックなレイアウトにも使用できます。
• 列は、パディングによって溝（列のコンテンツ間のギャップ）を作成します。 そのパディングは、*。rows *の負のマージンを介して最初と最後の列の行にオフセットされます。
• グリッド列は、スパンする12の使用可能な列の数を指定することにより作成されます。 たとえば、3つの等しい列は3つの .col-xs-4 を使用します。

Example	Description	Download link
Grids	This example indicates about grid structure in Bootstrap.	Download