CSS | complemento de desplazamiento

El CSS Scroll Snap es un módulo incorporado. Introduce la posición de ajuste de desplazamiento a la tecnología web. El puerto de desplazamiento del contenedor de desplazamiento funciona cuando la operación de desplazamiento hizo su trabajo. Este módulo es nuevo en HTML 5 antes de que hubiera un módulo similar conocido como Scroll Snap Point que se eliminó y reemplazó por este módulo Scroll Snap .

Hay dos tipos de propiedades en el módulo Scroll Snap, una es para contenedores y las otras son para elementos secundarios de esos contenedores.

Propiedades CSS en Contenedores:

Propiedades	Descripción
scroll-snap-type	Esta propiedad define cómo se imponen los puntos de ajuste estrictos en el contenedor de desplazamiento.
scroll-snap-stop	Esta propiedad define si el contenedor de desplazamiento puede «pasar por alto» posibles posiciones de ajuste.
relleno de desplazamiento	Esta propiedad es una propiedad abreviada que define todo el scroll-padding-*
scroll-padding-top	Esta propiedad define los desplazamientos para la parte superior de la región de visualización óptima del puerto de desplazamiento.
desplazamiento-relleno-derecha	Esta propiedad define los desplazamientos a la derecha de la región de visualización óptima del puerto de desplazamiento.
scroll-padding-bottom	Esta propiedad define compensaciones para la parte inferior de la región de visualización óptima del puerto de desplazamiento.
desplazamiento-relleno-izquierda	Esta propiedad define los desplazamientos a la izquierda de la región de visualización óptima del puerto de desplazamiento.
desplazamiento-relleno-en línea	Esta propiedad es una propiedad abreviada que establece el relleno de desplazamiento a mano para la dimensión en línea.
scroll-padding-inline-start	Esta propiedad define los desplazamientos para el borde de inicio en la dimensión en línea de la región de visualización óptima del puerto de desplazamiento.
scroll-padding-inline-end	Esta propiedad define los desplazamientos para el borde final en la dimensión en línea de la región de visualización óptima del puerto de desplazamiento.
bloque de relleno de desplazamiento	Esta propiedad es una propiedad abreviada que establece el relleno de desplazamiento a mano para la dimensión del bloque.
desplazamiento-relleno-bloque-inicio	Esta propiedad define los desplazamientos para el borde de inicio en la dimensión del bloque de la región de visualización óptima del puerto de desplazamiento.
scroll-padding-block-end	Esta propiedad define los desplazamientos para el borde final en la dimensión del bloque de la región de visualización óptima del puerto de desplazamiento.

Propiedades CSS en niños:

Propiedades	Descripción
desplazar-ajustar-alinear	Esta propiedad define la posición de ajuste del cuadro como una alineación de su área de ajuste.
margen de desplazamiento	Esta propiedad es una propiedad abreviada que define todo el margen de desplazamiento.
desplazamiento-margen-superior	Esta propiedad define el margen superior del área de ajuste de desplazamiento que se utiliza para ajustar este cuadro al puerto de ajuste.
desplazamiento-margen-derecha	Esta propiedad define el margen derecho del área de ajuste de desplazamiento que se utiliza para ajustar este cuadro al puerto de ajuste.
desplazamiento-margen-inferior	Esta propiedad define el margen inferior del área de ajuste de desplazamiento que se utiliza para ajustar este cuadro al puerto de ajuste.
desplazamiento-margen-izquierda	Esta propiedad define el margen izquierdo del área de ajuste de desplazamiento que se utiliza para ajustar este cuadro al puerto de ajuste.
desplazamiento-margen-en línea	Esta propiedad es una propiedad abreviada que establece el margen de desplazamiento a mano para la dimensión en línea.
scroll-margin-inline-start	Esta propiedad define el margen del área de ajuste de desplazamiento al comienzo de la dimensión en línea.
scroll-margin-inline-end	Esta propiedad define el margen del área de ajuste de desplazamiento al final de la dimensión en línea.
bloque de margen de desplazamiento	Esta propiedad es una propiedad abreviada que establece el margen de desplazamiento a mano para la dimensión del bloque.
desplazamiento-margen-bloque-inicio	Esta propiedad define el margen del área de ajuste de desplazamiento al comienzo de la dimensión del bloque.
scroll-margin-block-end	Esta propiedad define el margen del área de ajuste de desplazamiento al final de la dimensión del bloque.

Navegadores compatibles: los navegadores compatibles con los módulos Scroll Snap se enumeran a continuación:

• Google Chrome
• explorador de Internet
• Firefox
• Safari
• Ópera