先看這個例子
捲動框高 120px、overflow:auto。標題設 sticky、top0，後面內容提供 300px 局部可捲範圍。
| 情況 | 輸入或查看方法 | 結果與意思 |
|---|---|---|
| 開始 | scrollTop0 | 標題在捲動框頂部 |
| 區內捲動 | scrollTop80 | 標題仍在捲動框頂部 |
| 外層文件 | 查整頁捲動位置 | 區內捲動毋須帶動整頁 |
瀏覽器怎樣處理
Sticky 按最近的相關捲動區計算，並受包含區塊限制；它不等同固定在視窗。標題實際較高也會影響空間，所以本例用最小高度，容許文字增高。
一般標題會隨內容捲走
反例保留捲動框，移除 sticky。
<style>body{margin:8px}</style>
<style>.scroller{height:120px;overflow:auto}.heading{margin:0;background:white}.content{height:300px}</style><section class="scroller"><h2 class="heading">工作坊記錄</h2><section class="content"><p>更多本地資料在此延續。</p></section></section>scrollTop80 時，一般標題較原位向上移 80px，不會留在區頂。
試着修正
本例是否證明標題離開所屬範圍後仍永遠固定？
查看參考答案
不是。包含區塊邊界會限制 sticky；須按真正區域和完整範圍測試。
- 捲動前後，量標題相對捲動框頂部的位置。
- 保留區內焦點和捲動路徑。