お気に入り表示 favorites-view

Last update: Mon Jul 22 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

トピック：

作成対象：

開発者
ユーザー

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

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

.s7ecatalogsearchviewer .s7favoritesview

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

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

の背景色の

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

幅

ビューの幅。

例 – 幅 100 ピクセルで、背景が半透明の「お気に入り」ビューを設定する

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

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

.s7ecatalogsearchviewer .s7favoritesview .s7thumbcell

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

margin

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

例 – 10 ピクセルの間隔を設定する

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

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

.s7ecatalogsearchviewer .s7favoritesview .s7thumb

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

幅

サムネールの幅

高さ

サムネールの高さ

境界線

サムネールのボーダー。

NOTE

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

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

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

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

.s7ecatalogsearchviewer .s7favoritesview .s7label

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

font-famiy

フォント名。

font-size

フォントサイズ。

例 – 14 ピクセルの Helvetica® フォントでラベルをセットアップする

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

recommendation-more-help

b7426f53-aad9-4c00-83fc-664f30f681e8