bootstrap怎麼引入容器文件

Bootstrap 容器檔案用於建立響應式佈局，它包括一個或多個列，這些列被包裹在一個行的 div 中。引入Bootstrap 容器檔案需要以下步驟：安裝Bootstrap將容器檔案新增至HTML建立一個容器建立行和列

如何引入Bootstrap 容器檔案

Bootstrap 容器檔案用於建立一個靈活的響應式佈局，它包含一個或多個列，這些列被包裹在一個行的div 中。引入Bootstrap 容器檔案需要以下步驟：

1. 安裝Bootstrap

• 使用NPM：npm install bootstrap
• #使用CDN：https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css

#2 . 將容器檔案新增至HTML

<code class="html"><link rel="stylesheet" href="path/to/bootstrap.min.css"></code>

3. 建立一個容器

<code class="html"><div class="container">
  <!-- 内容 -->
</div></code>

4. 建立行與列

#

<code class="html"><div class="container">
  <div class="row">
    <div class="col-sm-6">
      <!-- 第一列的内容 -->
    </div>
    <div class="col-sm-6">
      <!-- 第二列的内容 -->
    </div>
  </div>
</div></code>

注意：

• container 類別為容器提供內邊距。
• row 類別建立一個水平行。
• col-* 類別用於建立具有特定寬度和間距的列。例如，col-sm-6 建立了一個在小螢幕（sm）裝置上佔 6 格的欄位。

以上是bootstrap怎麼引入容器文件的詳細內容。更多資訊請關注PHP中文網其他相關文章！