設定指示符

設定指標是檢視器底部呈現的一系列點。它顯示集內的當前位置。

set指示符的CSS屬性

使用下列CSS類別選擇器控制設定指標容器的外觀：

.s7carouselviewer .s7setindicator

CSS屬性	說明
背景色	設定指示符的十六進位格式的背景顏色。

注意

設定指示符支援模式屬性選擇器，可用於為虛線和數字操作模式應用不同的樣式。具體來說，mode="numeric"對應於數字操作模式；mode="dotted"對應於預設點狀態。

示例——要設定具有白色背景的設定指示符：

.s7carouselviewer .s7setindicator { 
 background-color: #FFFFFF; 
}

使用CSS類別選擇器控制個別設定指標點的外觀。它適用於點狀和數字操作模式中的項目。

.s7carouselviewer .s7setindicator .s7dot

CSS屬性	說明
width	設定指示器點的寬度。
height	設定指示點的高度。
左邊距	左邊界（以像素為單位）。
邊距頂端	上邊界（以像素為單位）。
邊界右側	右邊距（像素）。
邊距——底部	底部邊界（以像素為單位）。
邊框半徑	邊框半徑（像素）。
背景色	十六進位格式的背景顏色。
font-family	字型名稱。
字型大小	字型大小。
color	字型顏色。
垂直對齊	橫幅索引的垂直對齊。
線高	橫幅索引的文字高度。

注意

設定指標項目支援state屬性選擇器，可用來將不同的外觀套用至不同的縮圖狀態。特別是state="selected"對應於集合中的當前元素；state="unselected"對應於預設項目狀態。

範例——以點狀模式設定指示符，讓案頭系統從檢視器底部放置20像素。未選取的點是黑色，具有50%的透明度，15 x 15像素，7像素為圓角。選取的點是黑色，具有90%的透明度、18 x 18像素和9像素的圓角。點之間的間距為5像素。

.s7carouselviewer.s7mouseinput .s7setindicator { 
 bottom: 20px; 
} 
.s7carouselviewer.s7mouseinput .s7setindicator[mode='dotted'] .s7dot{ 
 width:15px; 
 height:15px; 
 margin-left:2.5px; 
 margin-right:2.5px; 
 margin-top:2.5px; 
 margin-bottom:2.5px; 
} 
.s7carouselviewer.s7mouseinput .s7setindicator[mode='dotted'] .s7dot[state='selected'] {  
 width:18px; 
 height:18px; 
 background-color: #000000; 
 opacity: 0.9; 
 border-radius:9px; 
} 
.s7carouselviewer.s7mouseinput .s7setindicator[mode='dotted'] .s7dot[state='unselected'] {  
 width:15px; 
 height:15px; 
 background-color: #000000; 
 opacity: 0.5; 
 border-radius:7px; 
}