Bootstrap 网格系统是其最著名和最强大的特性之一。它允许您在页面上创建响应式布局，使您的网站在不同设备上都能够自适应显示。通过使用网格系统，您可以轻松地将页面划分为不同的列和行，以便更好地控制页面布局。
网格系统基础
Bootstrap 网格系统基于12列的布局。页面的整体宽度被分为12等分，每个列的宽度可以根据需要占据其中的若干等分。您可以通过添加相应的 CSS 类来定义每个元素应占据的列数。
响应式布局
Bootstrap 的网格系统是响应式的，这意味着您可以轻松地创建适应不同屏幕尺寸的布局。通过使用不同的 CSS 类，您可以定义在不同设备上显示的列数，从而实现响应式设计。
示例代码：
-- -------------------- ---- -------
---- ------------------
---- ------------
---- --------------- -----------
---- ----------------------- ---
------
---- --------------- -----------
---- ----------------------- ---
------
------
------在上面的示例中，我们创建了一个包含两列的行。第一列在大屏幕上占据6列，在小屏幕上占据12列；第二列也是如此。这样，无论用户使用何种设备，页面都能够以最佳方式显示。
嵌套网格
您还可以在网格系统中嵌套行和列，以创建更复杂的布局。通过嵌套网格，您可以更加灵活地控制页面的结构。
示例代码：
-- -------------------- ---- -------
---- ------------------
---- ------------
---- -----------------
---- ----- ---
------
---- -----------------
---- ----- ---
---- ------------
---- -----------------
---- --------- ---
------
---- -----------------
---- --------- ---
------
------
------
------
------在上面的示例中，我们创建了一个包含两列的行。第二列中又嵌套了一个包含两列的行。这种嵌套结构可以无限延伸，以满足您的布局需求。
以上就是关于 Bootstrap 网格系统的基础知识。通过灵活运用网格系统，您可以轻松创建出美观且具有响应式设计的网页布局。在接下来的章节中，我们将深入探讨 Bootstrap 的其他特性和组件。