Thuộc tính scroll-behavior CSS

Định nghĩa và cách sử dụng

Thuộc tính scroll-behavior xác định khi người dùng nhấp vào liên kết trong khung cuộn, có di chuyển mượt mà (có hiệu ứng động) đến vị trí, thay vì di chuyển thẳng.

Mẫu

Thêm hiệu ứng cuộn mượt mà cho tài liệu:

html {
  scroll-behavior: smooth;
}

Thử nghiệm trực tiếp

Cú pháp CSS

scroll-behavior: auto|smooth|initial|inherit;

Giá trị thuộc tính

Giá trị Mô tả
auto Giá trị mặc định. Cho phép các yếu tố trong khung cuộn di chuyển trực tiếp.
mượt Cho phép các yếu tố trong khung cuộn di chuyển mượt mà.
initial Đặt thuộc tính này về giá trị mặc định. Xem thêm initial.
inherit Kế thừa thuộc tính này từ phần tử cha. Xem thêm inherit.

Chi tiết kỹ thuật

Giá trị mặc định: auto
Kế thừa: Không
Chế tạo animation: Không hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation.
Phiên bản: Module Xem CSSOM (草案 làm việc)
Cú pháp JavaScript: object.style.scrollBehavior="smooth"

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính đó.

Chrome IE / Edge Firefox Safari Opera
61.0 79.0 36.0 14.0 48.0