CSS text-transform: Maiuscole, Minuscole e Capitalize (Esempi)

Una guida pratica su CSS text-transform e quando usare CSS invece di JavaScript per modificare davvero il testo.

CSS text-transform: Maiuscole, Minuscole e Capitalize

Molti sviluppatori cercano come "passare da maiuscolo a minuscolo con CSS" sperando in una modifica reale del testo. CSS però cambia solo l'apparenza visiva, non il valore reale della stringa. Questa guida spiega perché è importante.

Indice:

text-transform: lowercase

Il testo appare in minuscolo, ma la fonte rimane invariata.
.selettore { text-transform: lowercase; }

text-transform: uppercase

Il testo appare in maiuscolo senza modificare la stringa originale.
.selettore { text-transform: uppercase; }

text-transform: capitalize

Capitalize mostra la prima lettera di ogni parola in maiuscolo — solo visivamente.
.selettore { text-transform: capitalize; }

CSS vs JavaScript

Usa questa tabella per decidere quale tecnologia è più adatta al tuo bisogno.
Caso d'uso CSS JavaScript
Solo stile visivo Opzionale
Modifica reale del testo No
Invio di moduli No

Convertire il testo reale

Se hai bisogno che il testo cambi davvero (per copia-incolla o per un modulo), usa JavaScript o un convertitore.

FAQ

Se ti ponevi domande su CSS e formato, ecco la risposta chiave.

text-transform modifica il testo sorgente?

No. È solo una trasformazione visiva.

Quando usare JavaScript invece di CSS?

Usa JS quando hai bisogno che il valore reale del testo venga modificato.

C'è un'opzione rapida senza codice?

Sì. Usa il convertitore online.

Devi modificare il testo sorgente?

Usa il convertitore per un cambio formato reale, non solo visivo.

Apri il convertitore