收藏夾視圖包含一列縮略圖。
我的最愛檢視容器的外觀由下列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;
}