お気に入り表示 favorites-view

お気に入り表示は、サムネール画像の列で構成されています。

お気に入り表示コンテナの外観は、次の CSS クラスセレクターで制御します。

.s7ecatalogviewer .s7favoritesview

お気に入りビューの位置と高さはビューで管理されます。CSS では、幅の定義のみ可能です。

お気に入りビューの CSS プロパティ

の背景色の
[ お気に入り ] ビューの背景色
ビューの幅。

例 – 幅 100 ピクセルのお気に入りビューを半透明のグレーの背景で設定するには:

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

お気に入りのサムネール間の間隔は、次の CSS クラスセレクターで制御されます。

.s7ecatalogviewer .s7favoritesview .s7thumbcell

お気に入りのサムネールの CSS プロパティ

margin
各サムネールの周囲の垂直方向の余白のサイズ。 実際のサムネールの間隔は、.s7thumbcell に設定されている上下の余白 合計と等しくなります。

例 – 10 ピクセル間隔を設定するには:

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

個々のサムネールの外観は、次の CSS クラスセレクターで制御します。

.s7ecatalogviewer .s7favoritesview .s7thumb

お気に入りのサムネールの CSS プロパティ

サムネールの幅
高さ
サムネールの高さ
境界線
サムネールのボーダー。
NOTE
サムネールでは state 属性セレクターがサポートされており、これを使用して異なるスキンを異なるサムネール状態に適用できます。 特に、state="selected" は、ユーザーが最近選択したサムネールに対応します。 残りのサムネールに対応する属性 state="default"。 また、属性 state="over" は、マウスのカーソルを合わせたときに使用されます。

例 – 75 x 75 ピクセルのサムネールで、デフォルトの境界線が薄いグレーで、選択した境界線が濃いグレーになるように設定するには:

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

サムネールラベルの外観は、次の CSS クラスセレクターで制御します。

.s7ecatalogviewer .s7favoritesview .s7label

お気に入りラベルの CSS プロパティ

font-famiy
フォント名。
font-size
フォントサイズ。

例 – 14 ピクセルの Helvetica® フォントでラベルを設定するには:

.s7ecatalogviewer .s7favoritesview .s7label {
 font-family: Helvetica,sans-serif;
 font-size: 14px;
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8