語法
滾動類型scroll-snap-type
Setting how strictly snap points are enforced on the scroll container.
Overview
| Class | Declarations |
|---|---|
scroll-snap-type:value | scroll-snap-type: value;
|
scroll-snap:x | scroll-snap-type: x;
|
scroll-snap:y | scroll-snap-type: y;
|
scroll-snap:both | scroll-snap-type: both;
|
scroll-snap:block | scroll-snap-type: block;
|
scroll-snap:inline | scroll-snap-type: inline;
|
scroll-snap-type:x|mandatory | scroll-snap-type: x mandatory;
|
scroll-snap-type:y|proximity | scroll-snap-type: y proximity;
|
scroll-snap-type:both|mandatory | scroll-snap-type: both mandatory;
|
scroll-snap-type:none | scroll-snap-type: none;
|
Conditionally apply
Apply styles based on different states using selectors and applying conditionally.
<div class="scroll-snap-type:both:hover scroll-snap-type:both@sm scroll-snap-type:both@dark scroll-snap-type:both@print">…</div>