Operation Manual
465
DREAMWEAVER GEBRUIKEN
Spry-pagina's visueel opbouwen
Laatst bijgewerkt 2/5/2011
Alle CSS-regels in de volgende onderwerpen verwijzen naar de standaardregels in het bestand
SpryValidationTextField.css. Wanneer u een Spry-widget tekstveld voor validatie maakt, slaat Dreamweaver het
bestand SpryValidationTextField.css op in de map SpryAssets van uw site. Het is wellicht interessant om dit bestand
te raadplegen omdat het nuttige informatie bevat over de diverse stijlen die u op de widget kunt toepassen.
Hoewel u de regels voor de widget tekstveld voor validatie gemakkelijk rechtstreeks in het bijbehorende CSS-bestand
kunt bewerken, kunt u ook het deelvenster CSS-stijlen gebruiken om de CSS van de widget te bewerken. Het
deelvenster CSS-stijlen is handig om de CSS-klassen te zoeken die aan de verschillende onderdelen van de widget zijn
toegewezen, met name als u de modus Huidig van het paneel gebruikt.
Meer Help-onderwerpen
“Het deelvenster CSS-stijlen in de modus Huidig” op pagina 132
Tekst opmaken van foutbericht voor widget tekstveld voor validatie
Standaard worden foutberichten voor de widget tekstveld voor validatie weergegeven in een kader met een rode rand
van 1 pixel dik.
❖ Als u de tekstopmaak van de foutberichten voor een widget tekstveld voor validatie wilt wijzigen, gebruikt u de
volgende tabel om de desbetreffende CSS-regel op te zoeken. Daarna verandert u de standaardeigenschappen of
voegt u uw eigen tekstopmaakeigenschappen en -waarden toe:
De achtergrondkleur wijzigen van de widget tekstveld voor validatie
❖ Als u de achtergrondkleuren van de widget tekstveld voor validatie in de diverse toestanden wilt wijzigen, gebruikt
u de volgende tabel om de desbetreffende CSS-regel op te zoeken, en verandert u de standaardwaarden voor de
achtergrondkleur:
Te wijzigen tekst Relevante CSS-regel Relevante eigenschappen om te
wijzigen
Tekst van foutbericht .textfieldRequiredState .textfieldRequiredMsg, .textfieldInvalidFormatState
.textfieldInvalidFormatMsg, .textfieldMinValueState
.textfieldMinValueMsg, .textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg, .textfieldMaxCharsState
.textfieldMaxCharsMsg
kleur: #CC3333; rand: 1px solid
#CC3333;
Te wijzigen kleur Relevante CSS-regel Relevante eigenschap om te
wijzigen
Achtergrondkleur van widget
in toestand Geldig
.textfieldValidState input, input.textfieldValidState background-color: #B8F5B1;
Achtergrondkleur van widget
in toestand Ongeldig
input.textfieldRequiredState, .textfieldRequiredState input,
input.textfieldInvalidFormatState, .textfieldInvalidFormatState
input, input.textfieldMinValueState, .textfieldMinValueState input,
input.textfieldMaxValueState, .textfieldMaxValueState input,
input.textfieldMinCharsState, .textfieldMinCharsState input,
input.textfieldMaxCharsState, .textfieldMaxCharsState input
background-color: #FF9F9F;
Achtergrondkleur van widget
bij focus
.textfieldFocusState input, input.textfieldFocusState background-color: #FFFFCC;