在 Bootstrap 5 中，容器（Container）是響應式網頁設計的基礎結構，用於包裹網頁內容，並為內部元素提供對齊和間距。容器分為 固定寬度容器 和 流體容器 兩種形式。


1. 什麼是容器 (Container)?

容器是 Bootstrap 提供的核心布局工具。

容器確保內容在不

職場

音樂藝文

學習

<p class="draft-block draft--p left">自學辛苦路~遇問題無法解決</p>

以行動支持創作者！付費即可解鎖

Web3

自學教程01

金融工程師的筆記

螢幕

網頁

設計

基礎

執行

響應式網頁設計基礎：容器系統 (Containers)

1. HTML 基礎：結構化內容

HTML（超文本標記語言）是用來描述網頁內容結構的語言。HTML 的核心由標籤（tags）組成，用於定義網頁的不同部分。

HTML 結構

HTML 的基本結構如下：

<!DOCTYPE html>
<html lang="zh-Hant">
<head>
 

投資理財

結構

網站

互動

輸入

語言

HTML、CSS、JavaScript 的基本知識

Bootstrap 提供多種安裝方式以滿足不同開發環境的需求。以下將逐步介紹使用 CDN、npm/yarn 和本地安裝的方式，並說明如何引入 Bootstrap。


1. 使用 CDN 快速開始

CDN (Content Delivery Network) 是最快速的方式，無需下載檔案，直接透過

安裝

檔案

下載

開發

專案

安裝與引入 Bootstrap 5



框架的歷史與用途

Bootstrap 是一個由 Twitter 開發的開源前端框架，最初由 Mark Otto 和 Jacob Thornton 在 2011 年發布，目的是幫助開發者快速設計響應式網頁。Bootstrap 的主要特色是提供一組預設的 HTML、CSS 和 JavaScript