CSS overscroll-behavior-block 屬性

定義和用法

overscroll-behavior-block 屬性用于在嘗試在塊方向滾動超出滾動邊界時，關閉元素上的滾動鏈（scroll chaining）或過度滾動反饋（overscroll affordance）。

滾動鏈是指在一個元素上過度滾動會導致父元素的滾動行為。這是默認行為。

過度滾動反饋是當用戶嘗試滾動超出滾動邊界時給予的反饋。例如，在移動設備上，當嘗試滾動超出頁面頂部時，通常會伴隨著頁面刷新的視覺反饋。

CSS 的 overscroll-behavior-block 和 overscroll-behavior-inline 屬性與 overscroll-behavior-x 和 overscroll-behavior-y 屬性非常相似，但 overscroll-behavior-block 和 overscroll-behavior-inline 屬性依賴于塊方向和行內方向。

注意：相關的 CSS 屬性 writing-mode 定義了塊方向。這會影響塊方向是在 x 方向還是 y 方向，以及 overscroll-behavior-block 屬性的結果。對于英文頁面，塊方向是向下的，行內方向是從左到右的。

在塊方向上關閉可滾動的 <div> 元素的滾動鏈：

#yellowDiv {
  overscroll-behavior-block: contain;
}

將 <div> 元素的 writing-mode 屬性值設置為 'vertical-rl' 時，塊方向變為 x 方向，因此 overscroll-behavior-block 現在在 x 方向上起作用，而不是 y 方向：

#yellowDiv {
  writing-mode: vertical-rl;
  overscroll-behavior-block: contain;
}

overscroll-behavior-block: auto|contain|none|initial|inherit;

默認值：	auto
繼承性：	否
動畫制作：	不支持。請參閱：動畫相關屬性。
版本：	CSS3
JavaScript 語法：	object.style.overscrollBehaviorBlock="none"

表格中的數字表示首個完全支持該屬性的瀏覽器版本。

Chrome	Edge	Firefox	Safari	Opera
63.0	18.0	59.0	16.0	50.0