設定指示器是在觸摸設備上使用查看器時在主色板上呈現的一系列點。 當滾動按鈕不可用時,這些點可幫助用戶瀏覽縮略圖頁面。
設定指示器的CSS屬性
使用以下CSS類選擇器控制設定指示器容器的外觀:
.s7mixedmediaviewer .s7setindicator
CSS屬性 |
說明 |
---|---|
背景色 |
設定指示器的十六進位格式的背景顏色。 |
示例 — 要建立帶白色背景的集指示符:
.s7mixedmediaviewer .s7setindicator {
background-color: #FFFFFF;
}
使用CSS類選擇器控制單個設定指示器點的外觀:
.s7mixedmediaviewer .s7setindicator .s7dot
CSS屬性 |
說明 |
---|---|
width |
設定指示器點的寬度。 |
height |
設定指示器點的高度。 |
左邊距 |
左邊距(像素)。 |
上邊距 |
上邊距(像素)。 |
邊距右 |
右邊距(像素)。 |
邊距底 |
底邊距(像素)。 |
邊界半徑 |
邊框半徑(以像素為單位)。 |
背景色 |
十六進位格式的背景色。 |
設定指示器點支援 state
屬性選擇器,可用於將不同外觀應用於不同的縮略圖狀態。 特別是, state="selected"
與縮略圖的當前頁面相對應, state="unselected"
與預設點狀態相對應。
示例 — 要建立一個15 x 15像素的設定指示器點,其中有兩個像素水準邊距、五個像素頂邊距、一個像素底邊距、12像素半徑、#D5D3D3預設顏色和#939393動顏色:
.s7mixedmediaviewer .s7setindicator .s7dot {
width:15px;
height:15px;
margin-left:2px;
margin-top:5px;
margin-right:2px;
margin-bottom:1px;
border-radius:12px;
background-color:#D5D3D3;
}
.s7mixedmediaviewer .s7setindicator .s7dot[state="selected"] {
background-color:#939393;
}