從手機到PC：Bootstrap5響應式佈局實現步驟

Bootstrap5是實現網頁響應式佈局的高效工具，核心優勢包括自動適配多設備的響應式設計、12列柵格系統、豐富組件及輕量CDN引入方式。使用時需先在HTML中通過CDN引入CSS和JS文件，關鍵是設置`<meta name="viewport">`確保手機端正確顯示。 其響應式核心爲柵格系統：頁面分爲12列，用`row`包裹內容，`col-*`指定列寬（`*`爲列數），通過斷點前綴（xs<576px、sm≥576px、md≥768px、lg≥992px、xl≥1200px）適配不同屏幕。容器分爲固定寬度的`container`和全屏的`container-fluid`。 實戰中，通過柵格系統可快速實現內容區與側邊欄的自適應佈局（如`col-lg-9`內容區、`col-lg-3`側邊欄，小屏幕自動堆疊爲`col-sm-12`）。輔助類如`text-center`、`bg-*`可優化樣式。掌握這些核心點，即可讓頁面在手機、平板