Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Impara Introduzione alle Trasformazioni CSS | Trasformazione degli Elementi con CSS
Tecniche CSS Avanzate

bookIntroduzione alle Trasformazioni CSS

Possiamo aggiungere movimento alle nostre pagine web. Le trasformazioni modificano la forma e la posizione di un elemento senza influenzare il resto della pagina. Di conseguenza, saremo in grado di creare i seguenti effetti:

Possiamo aggiungere lo scaling agli elementi:

Possiamo aggiungere la rotazione agli elementi:

Possiamo aggiungere la traslazione agli elementi:

Possiamo aggiungere l'inclinazione agli elementi:

Nota

Tutti questi effetti si ottengono tramite una sola proprietà: transform, utilizzando valori diversi. È inoltre importante sottolineare che animation e @keyframe sono stati aggiunti solo per mostrare la differenza tra lo stato iniziale e quello finale dell'elemento. Questo non significa che transform venga utilizzato solo con alcune animazioni. Analizzeremo tutti gli effetti nei prossimi capitoli in modo dettagliato.

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 5. Capitolo 1

Chieda ad AI

expand

Chieda ad AI

ChatGPT

Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione

Awesome!

Completion rate improved to 2.04

bookIntroduzione alle Trasformazioni CSS

Scorri per mostrare il menu

Possiamo aggiungere movimento alle nostre pagine web. Le trasformazioni modificano la forma e la posizione di un elemento senza influenzare il resto della pagina. Di conseguenza, saremo in grado di creare i seguenti effetti:

Possiamo aggiungere lo scaling agli elementi:

Possiamo aggiungere la rotazione agli elementi:

Possiamo aggiungere la traslazione agli elementi:

Possiamo aggiungere l'inclinazione agli elementi:

Nota

Tutti questi effetti si ottengono tramite una sola proprietà: transform, utilizzando valori diversi. È inoltre importante sottolineare che animation e @keyframe sono stati aggiunti solo per mostrare la differenza tra lo stato iniziale e quello finale dell'elemento. Questo non significa che transform venga utilizzato solo con alcune animazioni. Analizzeremo tutti gli effetti nei prossimi capitoli in modo dettagliato.

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 5. Capitolo 1
some-alt