Exibição de favoritos

A exibição Favoritos consiste em uma coluna de imagens em miniatura.

A aparência do contêiner de exibição Favoritos é controlada com o seguinte seletor de classe CSS:

.s7ecatalogviewer .s7favoritesview

A posição e a altura da exibição Favoritos são gerenciadas pela exibição; em CSS, só é possível definir a largura.

Propriedades CSS da exibição Favoritos

cor do fundo

Cor do plano de fundo da exibição Favoritos.

width

Largura da exibição.

Exemplo - para configurar uma exibição Favoritos com 100 pixels de largura com um plano de fundo cinza semitransparente.

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

O espaçamento entre miniaturas Favoritos é controlado com o seguinte seletor de classe CSS:

.s7ecatalogviewer .s7favoritesview .s7thumbcell

Propriedades CSS das miniaturas Favoritas

margem

O tamanho da margem vertical em torno de cada miniatura. O espaçamento real da miniatura é igual à soma da margem superior e inferior definida para .s7thumbcell .

Exemplo - para configurar um espaçamento de 10 pixels.

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

A aparência da miniatura individual é controlada com o seguinte seletor de classe CSS:

.s7ecatalogviewer .s7favoritesview .s7thumb

Propriedades CSS das miniaturas Favoritas

largura

Largura da miniatura.

altura

Altura da miniatura.

border

Borda da miniatura.

OBSERVAÇÃO

A miniatura é compatível com o seletor de atributos state, que pode ser usado para aplicar capas diferentes a estados de miniatura diferentes. Especificamente, state="selected" corresponde à miniatura recentemente selecionada pelo usuário. state="default" corresponde ao restante das miniaturas. E state="over" é usado no mouse.

Exemplo - para configurar miniaturas com 75 x 75 pixels, tenha uma borda padrão cinza-claro e uma borda cinza-escura selecionada.

.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; 
}

A aparência do rótulo de miniatura é controlada com o seguinte seletor de classe CSS:

.s7ecatalogviewer .s7favoritesview .s7label

Propriedades CSS do rótulo Favoritos

família de fontes

Nome da fonte.

tamanho da fonte

Tamanho da fonte.

Exemplo - para configurar rótulos com uma fonte Helvetica de 14 pixels.

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

Nesta página

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now