La vista Preferiti è costituita da una colonna di miniature.
L'aspetto del contenitore di visualizzazione Preferiti è controllato con il seguente selettore di classe CSS:
.s7ecatalogviewer .s7favoritesview
La posizione e l'altezza della vista Preferiti vengono gestite dalla vista. in CSS è possibile definire solo la larghezza.
Proprietà CSS della vista Preferiti
colore di sfondo |
Colore di sfondo della vista Preferiti. |
width |
Larghezza della visualizzazione. |
Esempio: per impostare una visualizzazione Preferiti larga 100 pixel con sfondo grigio semitrasparente:
.s7ecatalogviewer .s7favoritesview {
width: 100px;
background-color: rgba(221, 221, 221, 0.5);
}
La spaziatura tra le miniature Preferiti è controllata dal seguente selettore di classe CSS:
.s7ecatalogviewer .s7favoritesview .s7thumbcell
Proprietà CSS delle miniature Preferiti
margine |
Dimensione del margine verticale intorno a ciascuna miniatura. La spaziatura effettiva delle miniature è uguale alla somma del margine superiore e inferiore impostato per .s7thumbcell . |
Esempio: per impostare la spaziatura tra dieci pixel:
.s7ecatalogviewer .s7favoritesview .s7thumbcell {
margin: 5px;
}
L’aspetto della singola miniatura è controllato con il seguente selettore di classe CSS:
.s7ecatalogviewer .s7favoritesview .s7thumb
Proprietà CSS delle miniature Preferiti
larghezza |
Larghezza della miniatura. |
height |
Altezza della miniatura. |
border |
Bordo della miniatura. |
La miniatura supporta state
selettore di attributi, che può essere utilizzato per applicare skin diversi a diversi stati di miniatura. In particolare, state="selected"
corrisponde alla miniatura selezionata di recente dall’utente. Attributo state="default"
corrisponde al resto delle miniature. E l'attributo state="over"
viene utilizzato al passaggio del mouse.
Esempio: per impostare miniature con 75 x 75 pixel, è necessario impostare un bordo di default grigio chiaro e un bordo selezionato di grigio scuro:
.s7ecatalogviewer .s7favoritesview .s7thumb {
width: 75px;
height: 75px;
}
.s7ecatalogviewer .s7favoritesview .s7thumb[state="default"] {
border: 1px solid #dddddd;
}
.s7ecatalogviewer .s7favoritesview .s7thumb[state="selected"] {
border: 1px solid #666666;
}
L’aspetto dell’etichetta miniatura è controllato con il seguente selettore di classe CSS:
.s7ecatalogviewer .s7favoritesview .s7label
Proprietà CSS dell’etichetta Preferiti
font-family |
Nome carattere. |
font-size |
Dimensione del carattere. |
Esempio: per impostare etichette con un carattere Helvetica® da 14 pixel:
.s7ecatalogviewer .s7favoritesview .s7label {
font-family: Helvetica,sans-serif;
font-size: 14px;
}