收藏夾視圖

收藏夾視圖包含一列縮略圖。

我的最愛檢視容器的外觀由下列CSS類別選取器控制:

.s7ecatalogsearchviewer .s7favoritesview

「收藏夾」視圖的位置和高度由視圖管理;在CSS中,只能定義寬度。

收藏夾視圖的CSS屬性

背景顏色

「收藏夾」視圖的背景顏色。

width

檢視的寬度。

示例 — 設定半透明灰色背景為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屬性收藏夾縮略圖

寬度

縮圖寬度。

height

縮圖的高度。

border

縮圖的邊框。

注意

縮圖支援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屬性

字型系列

字型名稱。

字型大小

字型大小.

示例 — 用14像素Helvetica字型設定標籤。

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

本頁內容