Cómo se calcula la posición del fondo

fondo-posición: 0 0;

¿Esto significa que la esquina superior izquierda de la imagen de fondo está alineada con la esquina superior izquierda del contenedor? De hecho, este es el fenómeno, pero no se puede decir eso porque la posición de fondo no utiliza la esquina superior izquierda de la imagen de fondo como punto base al calcular la posición.

La posición del fondo utiliza el punto central de la imagen de fondo como punto base.

Como se muestra arriba, el contenedor es 400 px * 400 px, la imagen de fondo es 200 px * 200 px, lo anterior La imagen es: posición de fondo: 50 50.

Entonces background-position: 0 0: el primer 0 significa que el punto central de la imagen de fondo coincide con la línea roja de la izquierda; el segundo 0 significa que el punto central de la imagen de fondo coincide con; la línea roja superior.

Entonces background-position: 100 100: el primer 100 significa que el punto central de la imagen de fondo coincide con la línea roja a la derecha el segundo 100 significa que el punto central de la imagen de fondo coincide con; la línea roja de abajo.

Es decir, entre 0-100, el punto central de la imagen está limitado a un rango:

Este rango va desde el borde izquierdo y derecho del contenedor hasta el ancho de la imagen de fondo / 2 .