Bootstrap 简明教程

Bootstrap - Grid Demo

What is a Grid?

Working of Bootstrap Grid System

网格系统用于通过包含您内容的一系列行和列创建页面布局。以下是如何使用 Bootstrap 网格系统 −

Grid systems are used for creating page layouts through a series of rows and columns that house your content. Here’s how the Bootstrap grid system works −

  1. Use rows to create horizontal groups of columns.

  2. Content should be placed within the columns, and only columns may be the immediate children of rows.

  3. Use the .themed-grid-col class to add some theming to the columns. This is not a default Bootstrap class.

  4. Create a grid with equal columns using .row-cols-* classes.

  5. Padding is used in columns to create gutters (gaps between column content). That padding is offset in rows using a negative margin on .rows for the first and last column.

Example

Description

Download link

This example indicates about grid structure in Bootstrap.

Download