版面配置詞條 3-11

側邊欄版面Sidebar Layout

也常叫做：側邊欄、側欄、Sidebar

你可能會這樣說

想做文件中心或部落格，需要左邊固定一排分類選單、右邊顯示內容，但兩邊寬度老是喬不攏，手機上更是直接疊在一起。

側邊欄版面是「一邊導覽、一邊內容」的經典結構，文件、教學、後台最常用。比例上側欄固定 240 到 280px，剩下的寬度給內容，讀起來最穩。

側欄在桌機可以黏在左側跟著捲動；到了手機就收成漢堡選單或置頂分頁，不要硬擠。

內容區記得設最大閱讀寬度（約 720px），否則超寬螢幕上一行字會長到讀不下去。

§ 快速開始
§ 進階設定
§ 常見問題
§ 更新紀錄

內容區：側欄固定寬度、內文限寬置中，一行字不會長到讀不下去。

側欄寬度內文最大寬

慣例：側欄固定 240–280px、內文限寬約 720px；手機上側欄收進漢堡選單，不要硬擠。

圖 3-12　拉動側欄寬度與內文限寬，體會「一邊導覽、一邊內容」的比例。

中文就可以

請做一個側邊欄版面：
左側選單固定 260px、黏在左側可捲動，右側內容區置中且最大寬 720px。
側欄項目分三組，組與組之間用小標分隔，目前項目有淺色底與左側強調線。
側欄內容太長時自己捲動，不影響右邊閱讀。
1024px 以下側欄收進漢堡選單，展開時蓋在內容上。