The scroll-behavior property
The scroll-behavior property specifies
smooth or instant scrolling within an element.
The property takes two values auto
(instant transition to the element) and
smooth (smooth transition).
Syntax
selector {
scroll-behavior: auto or smooth;
}
Example . The auto value
Let's set instant scrolling:
<div>text</div>
div {
scroll-behavior: auto;
width: 4000px;
height: 2000px;
background-color: #C2DDFD;
}
:
Example . The smooth value
Now let's set up smooth scrolling:
<div>text</div>
div {
scroll-behavior: smooth;
width: 4000px;
height: 2000px;
background-color: #C2DDFD;
}
:
See also
-
the
:fullscreenpseudo-class
that styles elements in full screen mode -
the
:defaultpseudo-class
that sets a default style for elements
