Editor Studio Two: aggiungere CSS personalizzato
Questo articolo si riferisce al nuovo Editor Studio Two, rilasciato a novembre 2026. Se non sai con certezza se stai utilizzando l'Editor Studio o l'Editor Studio Two, scopri di più qui.
Il CSS personalizzato è un linguaggio di stile che controlla l'aspetto degli elementi di un sito. Utilizzando il CSS, puoi personalizzare aspetti come colori, spaziatura, bordi, animazioni ed effetti al passaggio del mouse.
Nell'Editor Studio Two puoi utilizzare l'AI per generare il CSS di qualsiasi elemento descrivendo l'effetto che desideri con parole tue. Questo articolo spiega come generare il CSS con l'AI e cosa fare se il risultato deve essere modificato.
Il CSS personalizzato viene applicato all'elemento specifico che selezioni. Per applicare uno stile a tutti gli elementi dello stesso tipo (es. ogni tasto principale del sito), utilizza invece gli elementi con stile.
Utilizzare l'AI per aggiungere CSS a un elemento
Descrivi l'effetto che desideri e Aria genererà il codice CSS per te. Il risultato viene applicato immediatamente all'elemento, così puoi vederlo nell'area di lavoro.
Descrivi un effetto alla volta. Non combinare più modifiche in un unico prompt, perché potrebbero generare un risultato diverso da quello desiderato.
Includi lo stato, se pertinente, es. "al passaggio del mouse", "quando viene caricata la pagina", "quando è selezionato"
Fornisci dettagli specifici. Invece di "metti in risalto il tasto", prova con "aggiungi un bordo rosso spesso intorno al tasto al passaggio del mouse"
Generare CSS con l'AI:
Clicca sull'elemento a cui vuoi applicare lo stile.
Nel pannello Ispezione a destra, scorri in basso fino a CSS personalizzato e clicca su + Aggiungi.
Nel pannello CSS personalizzato, clicca sul campo Genera codice CSS con l'AI e inserisci una descrizione dell'effetto che desideri (es. "aggiungi un bordo blu luminoso al passaggio del mouse").
Premi Invio.
Il CSS viene generato e applicato all'elemento nell'area di lavoro. Sotto il campo appare un Riepilogo stile con una descrizione in linguaggio naturale di ciò che fa il codice.
Risolvere i problemi relativi al CSS
Se il risultato generato dall'AI non ha l'aspetto che ti aspettavi, puoi provare a migliorarlo in 2 modi: riscrivi il prompt o modifica direttamente il codice.
Per riscrivere il prompt:
Nel campo Genera codice CSS con l'AI, cancella il prompt precedente e inserisci una nuova descrizione.
Clicca su Invio. Il nuovo CSS sostituisce il risultato precedente nell'area di lavoro.
Per modificare manualmente il CSS:
Se il risultato generato dall'AI è vicino a quello desiderato ma non è ancora corretto, puoi modificare direttamente il codice senza ricominciare da capo.
Nel pannello CSS personalizzato, clicca su Modifica manualmente il CSS.
Aggiorna il codice nell'Editor CSS personalizzato.
Clicca su Salva.
FAQ
Clicca su una domanda qui sotto per scoprire di più sul CSS personalizzato.