Bootstrap5響應式設計：斷點設置與多設備適配指南

響應式設計讓網頁適配多設備，Bootstrap5通過預設斷點和組件簡化實現，無需從零編寫媒體查詢。其默認六個斷點（xs<576px、sm≥576px、md≥768px、lg≥992px、xl≥1200px、xxl≥1400px）是佈局切換臨界點。核心控制方式：一是響應式工具類（如d-sm-block在sm斷點顯示塊級元素），可控制元素顯示隱藏；二是柵格系統（row+col），列寬由斷點前綴控制（如col-md-6表示中等屏幕以上佔6列）。實戰中，手機單列、平板雙列、桌面三列布局，圖片用img-fluid自適應，導航欄用漢堡菜單適配移動端。可通過CSS變量自定義斷點。核心步驟：柵格列布局、工具類控制顯示、圖片自適應、導航摺疊，簡化響應式開發。