# 滚动捕捉简单使用
CSS Scroll Snap（CSS 滚动捕捉），即在滚动时对滚动位置进行捕捉。当滚动结束时，滚动位置会停留在捕捉点设置的位置。
scroll-snap-type是Scroll Snap标准中的一个属性，该属性定义在滚动容器中的一个捕捉点如何被严格的执行，也就是滚动捕捉的类型，设置在滚动容器。
scroll-snap-type接受以下值：
none禁用滚动捕捉x仅启用沿x轴方向捕捉y仅启用沿y轴方向捕捉block仅启用沿块轴方向捕捉inline仅启用沿内联轴方向捕捉both沿两个轴方向捕捉mandatory精确捕捉，它告诉浏览器在没有滚动发生时始终滚到捕捉位置。proximity非精确捕捉，如果滚动动作非常接近捕捉位置，它会告诉浏览器滚到捕捉位置。如果距离不太近，则浏览器不应该捕捉并且滚动将正常进行。
该属性需要与scroll-snap-align结合使用，设置在滚动容器内的元素，scroll-snap-align指定元素的那一部分与滚动容器的对应部分对齐。可设置值none、start、center、end，两个值分别指定两个方向上的对齐方式，当仅设定一个值时，表示两个方向都为该值。
下面是沿x轴方向捕捉，对齐方式为start，可以看到该方式下子元素左端始终对齐父容器的左端。延伸可以做成我们常见的幻灯片切换效果，而且带吸附效果，不用像以前需要用JavaScript写复杂的判断逻辑。
# 参考资料：
← fliter融合技-燃烧的火焰 非边缘捕捉 →