No termino de entender el funcionamiento de: ``` perspective: 8px; perspective-origin: 50%; <code> y lo de: ``` transform-origin: 0 50%; ...

Juan Esteban Galvis

Pregunta

student•hace 4 años

No termino de entender el funcionamiento de: ```

perspective: 8px;

perspective-origin: 50%;


y lo de: ```
transform-origin: 0 50%;
transform-origin: 50%;
transform-origin: top;

Juan David González Rodríguez

student•hace 4 años

Holaaa sii yo tenia la misma duda !! :D muchas gracias Estefany , entonces con el ++50%++ la perspectiva quedaría en el centro?
(su punto de partida es el centro)

Viéndolo con este ejemplo que compartió un compañero anteriormente.

Estefany Aguilar

teacher•hace 4 años

Holi Juan !

perspective: 8px;

pensémoslo como "la distancia" que hay desde donde está sentada la bruja roja hasta ti. Básicamente, qué tantos pixeles le estamos dando en el eje Z.

Todo lo que tenga que ver con

origin

nos va a decir desde qué parte de tu elemento quieres que o rote, o tenga perspectiva, etc... (así como veíamos en la clase de

transform-origin

) .

%

nos indica la posición en X o la posición en Y. Donde:

top left es 0% 0%
top right es 100% 0%
bottom left es 0% 100%
bottom right es 100% 100%

Adivina qué nos indicaría poner ese

50%

!!!! 🙈

Espero te haya sido útil 💚

No termino de entender el funcionamiento de: ``` perspective: 8px; perspective-origin: 50%; <code> y lo de: ``` transform-origin: 0 50%; ...

Curso de Transformaciones y Transiciones en CSS

Curso de Transformaciones y Transiciones en CSS