Suchschaltfläche search-button
CSS-Eigenschaften des Haupt-Viewer-Bereichs
Das Erscheinungsbild der Schaltfläche wird mit der folgenden CSS-Klassenauswahl gesteuert:
.s7ecatalogsearchviewer .s7searchbutton
CSS-Eigenschaft
Beschreibung
width
Breite der Schaltfläche.
Höhe
Höhe der Schaltfläche.
margin-top
Der Versatz am oberen Rand der Steuerleiste.
margin-left
Der Abstand zur nächsten Schaltfläche auf der linken Seite oder zur linken Seite der Steuerleiste, wenn diese Schaltfläche der erste in einer Zeile ist.
background-image
Das Bild, das für einen bestimmten Schaltflächenstatus angezeigt wird.
background-position
Position innerhalb des Bildsprites, wenn CSS-Sprites verwendet werden.
Siehe auch CSS-Sprites.
NOTE
Diese Schaltfläche unterstützt die Attributselektoren
state und selected, die verwendet werden können, um verschiedene Skins auf verschiedene Schaltflächenzustände anzuwenden.Insbesondere entspricht
selected='false' dem Status der ersten Bildlaufschaltfläche und selected='true' dem Status, in dem das Suchfeld aktiv ist.Die QuickInfo der Schaltfläche kann lokalisiert werden. Weitere Informationen finden Sie unter Lokalisierung von Benutzeroberflächenelementen .
Beispiel: Zum Einrichten einer Suchschaltfläche mit 28 x 28 Pixel und einem anderen Bild für jeden der vier verschiedenen Schaltflächenstatus, wenn ausgewählt oder nicht ausgewählt.
.s7ecatalogsearchviewer .s7searchbutton{
margin-top: 4px;
margin-left: 10px;
width:28px;
height:28px;
display: inline-block;
background-size:contain;
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='false'][state='up'] {
background-image:url(images/v2/Search_dark_up.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='false'][state='over'] {
background-image:url(images/v2/Search_dark_over.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='false'][state='down'] {
background-image:url(images/v2/Search_dark_down.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='false'][state='disabled'] {
background-image:url(images/v2/Search_dark_disabled.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='true'][state='up'] {
background-image:url(images/v2/Search_dark_over.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='true'][state='over'] {
background-image:url(images/v2/Search_dark_over.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='true'][state='down'] {
background-image:url(images/v2/Search_dark_over.png);
}
.s7ecatalogsearchviewer.s7mouseinput .s7searchbutton[selected='true'][state='disabled'] {
background-image:url(images/v2/Search_dark_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8