wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Preguntas sobre CSS Grid

Total questions: 20

Worksheet time: 10mins

Name
Class
Date
1.

¿Qué propiedad se usa para posicionar un elemento en la tercera columna de un grid?

a)

grid-column: 3

b)

grid-column-start: 3

c)

grid-row: 3

d)

grid-template: 3

2.

¿Cuál es la diferencia entre grid-column-start y grid-column-end?

a)

No hay diferencia

b)

grid-column-start define dónde comienza el elemento, grid-column-end define dónde termina

c)

Son propiedades para filas, no columnas

d)

Solo se pueden usar juntas

3.

¿Qué valor se usa para contar líneas desde el lado derecho del grid?

a)

Valores positivos

b)

Valores negativos

c)

Valores decimales

d)

Porcentajes

4.

¿Qué significa grid-column-end: -2?

a)

Termina en la segunda columna

b)

Termina en la penúltima línea vertical contando desde la derecha

c)

Termina dos columnas después

d)

Es un valor inválido

5.

¿Qué hace la palabra clave "span" en CSS Grid?

a)

Elimina el elemento

b)

Extiende el elemento por un número específico de columnas o filas

c)

Centra el elemento

d)

Oculta el elemento

6.

¿Cuál es la sintaxis correcta para que un elemento ocupe 3 columnas usando span?

a)

grid-column: span 3

b)

grid-column-end: span 3

c)

grid-span: 3

d)

column-span: 3

7.

¿Qué propiedad es la forma abreviada de grid-column-start y grid-column-end?

a)

grid-area

b)

grid-column

c)

grid-template

d)

grid-position

8.

¿Cómo se escribe grid-column para ir de la columna 2 a la 5?

a)

grid-column: 2-5

b)

grid-column: 2/5

c)

grid-column: 2 to 5

d)

grid-column: 2,5

9.

¿Qué propiedad se usa para posicionar elementos verticalmente en un grid?

a)

grid-column-start

b)

grid-vertical

c)

grid-row-start

d)

grid-y

10.

¿Cuál es la forma abreviada para grid-row-start y grid-row-end?

a)

grid-vertical

b)

grid-y

c)

grid-row

d)

row-position

11.

Si quiero posicionar un elemento en la columna 2 y fila 3, ¿qué propiedades uso?

a)

grid-x: 2; grid-y: 3

b)

grid-column: 2; grid-row: 3

c)

column: 2; row: 3

d)

position-x: 2; position-y: 3

12.

¿Qué hace grid-area en CSS Grid?

a)

Solo define el tamaño del grid

b)

Combina grid-column y grid-row en una sola propiedad

c)

Crea áreas automáticas

d)

Elimina espacios en blanco

13.

¿Cuál es el orden de valores en grid-area?

a)

columna-inicio / fila-inicio / columna-fin / fila-fin

b)

fila-inicio / columna-inicio / fila-fin / columna-fin

c)

inicio / fin / izquierda / derecha

d)

top / left / bottom / right

14.

Para que un elemento ocupe de la fila 2 a la 5, ¿qué escribo?

a)

grid-row: 2-5

b)

grid-row: 2 to 5

c)

grid-row: 2/5

d)

grid-row: 2,5

15.

¿Qué representa el punto (.) en grid-template-areas?

a)

Un error de sintaxis

b)

Una celda vacía

c)

El final del grid

d)

Un área especial

16.

¿Qué propiedad define las columnas de un grid?

a)

grid-columns

b)

grid-template-columns

c)

columns-template

d)

grid-column-template

17.

¿Qué significa grid-template-columns: 20% 20% 20% 20% 20%?

a)

Crea 5 columnas de igual ancho del 20% cada una

b)

Crea 20 columnas de 5% cada una

c)

Crea 1 columna del 100%

d)

Es una sintaxis inválida

18.

¿Para qué sirve la función repeat() en CSS Grid?

a)

Para repetir el mismo grid infinitamente

b)

Para simplificar la escritura de valores repetidos

c)

Para duplicar elementos

d)

Para crear copias del contenido

19.

¿Cómo se escribe repeat(5, 20%) correctamente?

a)

grid-template-columns: repeat(5, 20%)

b)

grid-repeat: 5 x 20%

c)

columns: repeat 5 times 20%

d)

grid-columns: 5(20%)

20.

¿Qué es la unidad "fr" en CSS Grid?

a)

Una unidad de píxeles fija

b)

Una fracción del espacio disponible

c)

Una medida en porcentaje

d)

Un valor absoluto en centímetros