Operation Manual

452
DREAMWEAVER GEBRUIKEN
Spry-pagina's visueel opbouwen
Laatst bijgewerkt 2/5/2011
De achtergrondkleur wijzigen van een inklapbaar-deelvensterwidget
❖ Als u de achtergrondkleuren van verschillende delen van een inklapbaar-deelvensterwidget wilt wijzigen, gebruikt
u de volgende tabel om de desbetreffende CSS-regel op te zoeken. Daarna voegt u eigenschappen en waarden voor
de gewenste achtergrondkleur toe of wijzigt u deze:
De breedte van een inklapbaar paneel beperken
Standaard wordt de inklapbaar-deelvensterwidget opengeklapt zodat de beschikbare ruimte geheel in beslag wordt
genomen. U kunt de breedte van een inklapbaar-deelvensterwidget echter beperken door een breedte-eigenschap voor
de inklapbaar-deelvenstercontainer in te stellen.
1 Zoek de CSS-regel .CollapsiblePanel op door het bestand SpryCollapsible Panel.css te openen. Deze regel definieert
eigenschappen voor het hoofdcontainerelement van de inklapbaar-deelvensterwidget.
U vindt de regel ook door de inklapbaar-deelvensterwidget te selecteren en het deelvenster CSS-stijlen te bekijken
(Venster > CSS-stijlen). Zorg ervoor dat het paneel is ingesteld op de modus Huidig.
2 Voeg een breedte-eigenschap en -waarde aan de regel toe, bijvoorbeeld width:. 300px;.
Werken met de widget deelvensters met tabs
Over de widget deelvensters met tabs
Een widget deelvensters met tabs is een reeks panelen die inhoud opslaat op een vrij beperkte ruimte. Sitebezoekers
kunnen de inhoud in de deelvensters met tabs verbergen of weergeven door op de tab te klikken van het paneel dat ze
willen bekijken. De deelvensters van de widget worden geopend naarmate de bezoeker op de verschillende tabs klikt.
In een widget deelvensters met tabs is maar één deelvenster tegelijk geopend. In het volgende voorbeeld ziet u een
widget deelvensters met tabs, waarvan het derde deelvenster is geopend:
Te wijzigen stijl Relevante CSS-regel Voorbeeld van toe te voegen of te wijzigen
eigenschappen en waarden
Tekst in het gehele inklapbare paneel .CollapsiblePanel font: Arial; font-size:medium;
Tekst op de paneeltab .CollapsiblePanelTab font: bold 0.7em sans-serif; (Dit is de standaardwaarde)
Tekst in het inhoudspaneel .CollapsiblePanelContent font: Arial; font-size:medium;
Te wijzigen kleur Relevante CSS-regel Voorbeeld van toe te voegen of te
wijzigen eigenschap en waarde
Achtergrondkleur van paneeltab .CollapsiblePanelTab background-color: #DDD; (Dit is de
standaardwaarde)
Achtergrondkleur van inhoudspaneel .CollapsiblePanelContent background-color: #DDD;
Achtergrondkleur van tab wanneer paneel is
geopend
.CollapsiblePanelOpen .CollapsiblePanelTab background-color: #EEE; (Dit is de
standaardwaarde)
Achtergrondkleur van geopende paneeltab
wanneer de muisaanwijzer eroverheen
beweegt
.CollapsiblePanelTabHover,
.CollapsiblePanelOpen
.CollapsiblePanelTabHover
background-color: #CCC; (Dit is de
standaardwaarde)