Clase Tailwind | Equivalente CSS | Descripción | Ejemplo |
---|---|---|---|
snap-none |
scroll-snap-type: none; | Desactiva el scroll snap. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-x |
scroll-snap-type: x mandatory; | Activa el scroll snap horizontal estricto. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-y |
scroll-snap-type: y mandatory; | Activa el scroll snap vertical estricto. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-x |
scroll-snap-type: x proximity; | Activa el scroll snap horizontal flexible. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-y |
scroll-snap-type: y proximity; | Activa el scroll snap vertical flexible. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-both |
scroll-snap-type: both mandatory; | Activa el scroll snap multiple estricto. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-both |
scroll-snap-type: both proximity; | Activa el scroll snap multiple flexible. |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-align-none |
scroll-snap-align: none; | Individualmente cada elemento no alineara (esta utilidad se le coloca a cada elemento) |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-start |
scroll-snap-align: start; | Individualmente cada elemento se alineara desde el inicio (esta utilidad se le coloca a cada elemento) |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-center |
scroll-snap-align: center; | Individualmente cada elemento se alineara desde el centro (esta utilidad se le coloca a cada elemento) |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-end |
scroll-snap-align: end; | Individualmente cada elemento se alineara desde el final (esta utilidad se le coloca a cada elemento) |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-normal |
scroll-snap-stop: normal; | Este valor permite un desplazamiento más fluido a través de las posiciones de ajuste. El desplazamiento puede "saltar" o pasar por encima de una posición de ajuste si el usuario realiza un gesto rápido, sin detenerse necesariamente en cada punto de ajuste. (esta utilidad se le coloca a cada elemento) |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|
snap-always |
scroll-snap-stop: always; | IEste valor fuerza al navegador a detenerse en cada posición de ajuste, incluso si el usuario intenta desplazarse rápidamente. Esto garantiza que el usuario no se pierda ninguna posición de ajuste y que la experiencia de desplazamiento sea más precisa. (esta utilidad se le coloca a cada elemento) |
11
12
13
14
15
21
22
23
24
25
31
32
33
34
35
41
42
43
44
45
51
52
53
54
55
|