Favoritenansicht

Die Favoritenansicht besteht aus einer Spalte mit Miniaturbildern.

Das Erscheinungsbild des Favoriten-Ansichtscontainers wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7ecatalogsearchviewer .s7favoritesview

Die Position und Höhe der Favoriten-Ansicht werden von der Ansicht verwaltet. in CSS ist es nur möglich, die Breite zu definieren.

CSS-Eigenschaften der Favoriten-Ansicht

background-color

Hintergrundfarbe der Favoriten-Ansicht.

width

Breite der Ansicht.

Beispiel: Zum Einrichten einer Favoriten-Ansicht mit einer Breite von 100 Pixel und einem halbtransparenten grauen Hintergrund.

.s7ecatalogsearchviewer .s7favoritesview { 
 width: 100px; 
 background-color: rgba(221, 221, 221, 0.5); 
}

Der Abstand zwischen Favoriten-Miniaturansichten wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7ecatalogsearchviewer .s7favoritesview .s7thumbcell

CSS-Eigenschaften der Favoriten-Miniaturansichten

margin

Die Größe des vertikalen Rands um jede Miniaturansicht. Der tatsächliche Abstand der Miniaturansichten entspricht der Summe des oberen und unteren Rands, der für .s7thumbcell festgelegt ist.

Beispiel: Zum Einrichten eines 10-Pixel-Abstands.

.s7ecatalogsearchviewer .s7favoritesview .s7thumbcell { 
 margin: 5px; 
}

Das Erscheinungsbild der einzelnen Miniaturansichten wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7ecatalogsearchviewer .s7favoritesview .s7thumb

CSS-Eigenschaften der Favoriten-Miniaturansichten

width

Breite der Miniaturansicht.

height

Höhe der Miniaturansicht.

rand

Rand der Miniaturansicht.

HINWEIS

Miniaturansichten unterstützen den Attributselektor state, der verwendet werden kann, um verschiedene Skins auf verschiedene Miniaturansichten anzuwenden. Insbesondere state="selected" entspricht der Miniaturansicht, die der Benutzer kürzlich ausgewählt hat. state="default" entspricht dem Rest der Miniaturansichten. Und state="over" wird beim Bewegen der Maus verwendet.

Beispiel: Zum Einrichten von Miniaturansichten mit 75 x 75 Pixel, einem hellgrauen Standardrahmen und einem dunkelgrauen Rahmen.

.s7ecatalogsearchviewer .s7favoritesview .s7thumb { 
 width: 75px; 
 height: 75px;  
} 
.s7ecatalogsearchviewer .s7favoritesview .s7thumb[state="default"] { 
 border: 1px solid #dddddd; 
} 
.s7ecatalogsearchviewer .s7favoritesview .s7thumb[state="selected"] { 
 border: 1px solid #666666; 
}

Das Erscheinungsbild der Miniaturansichtsbeschriftung wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7ecatalogsearchviewer .s7favoritesview .s7label

CSS-Eigenschaften der Bezeichnung "Favoriten"

Schriftfamilie

Schriftname.

Schriftgröße

Schriftgröße.

Beispiel - zum Einrichten von Bezeichnungen mit einer Helvetica-Schrift von 14 Pixel.

.s7ecatalogsearchviewer .s7favoritesview .s7label { 
 font-family: Helvetica,sans-serif; 
 font-size: 14px; 
}

Auf dieser Seite