Personalizzazione del widget Area di testo convalida



Nonostante la finestra di ispezione Proprietà consenta di eseguire semplici modifiche a un widget Area di testo convalida, essa non supporta le attività relative agli stili personalizzati. È possibile variare il CSS del widget Area di testo convalida in modo da creare un widget avente lo stile desiderato. Per un elenco più dettagliato delle attività relative agli stili, consultate www.adobe.com/go/learn_dw_sprytextarea_custom_it.

Tutte le regole CSS elencate negli argomenti che seguono fanno riferimento alle regole predefinite contenute nel file SpryValidationTextArea.css. Durante la creazione di un widget Area di testo convalida Spry, Dreamweaver salva il file SpryValidationTextArea.css nella cartella SpryAssets del sito. Le informazioni contenute nel file sono utili poiché contengono commenti sui vari stili che possono essere applicati al widget.

Nonostante sia possibile modificare facilmente le regole del widget Area di testo convalida direttamente nel file CSS associato, per modificare il CSS del widget è possibile anche utilizzare il pannello Stili CSS. Il pannello Stili CSS è utile per localizzare le classi CSS assegnate a parti differenti del widget, in particolar modo quando si utilizza la modalità Corrente del pannello.

Formattazione del testo dei messaggi di errore del widget Area di testo convalida

Per impostazione predefinita, i messaggi di errore relativi al widget Area di testo convalida vengono visualizzati in rosso, con un bordo di un pixel attorno al testo.

 Per modificare lo stile del testo dei messaggi di errore di un widget Area di testo convalida, utilizzate la seguente tabella per individuare la regola CSS appropriata e quindi modificate le proprietà predefinite o aggiungete proprietà e valori dello stile di testo desiderato:

Testo da modificare

Regola CSS pertinente

Proprietà relative da modificare

Testo del messaggio di errore

.textareaRequiredState .textareaRequiredMsg, .textareaMinCharsState .textareaMinCharsMsg, .textareaMaxCharsState .textareaMaxCharsMsg

color: #CC3333; border: 1px solid #CC3333;

Modifica dei colori di sfondo del widget Area di testo convalida

 Per modificare il colore di sfondo del widget Area di testo convalida in vari stati, utilizzare la tabella che segue per localizzare la regola CSS appropriata, quindi modificare i valori dei colori di sfondo predefiniti:

Colore di sfondo da modificare

Regola CSS pertinente

Proprietà relativa da modificare

Colore di sfondo del widget in stato valido

.textareaValidState textarea, textarea.textareaValidState

background-color: #B8F5B1;

Colore di sfondo del widget in stato non valido

textarea.textareaRequiredState, .textareaRequiredState textarea, textarea.textareaMinCharsState, .textareaMinCharsState textarea, textarea.textareaMaxCharsState, .textareaMaxCharsState textarea

background-color: #FF9F9F;

Colore di sfondo del widget attivo

.textareaFocusState textarea, textarea.textareaFocusState

background-color: #FFFFCC;