ページインジケーターには、現在のページのインデックスと合計ページ数が表示されます。 このボタンは、デスクトップシステムおよびタブレットではメインコントロールバーに表示され、携帯電話ではセカンダリコントロールバーに追加されます。 ページインジケーターは、CSSを使用して、サイズ設定、スキン表示および配置できます。
ページインジケーターの外観は、以下のCSSクラスセレクターを使用して制御します。
.s7ecatalogsearchviewer .s7pageindicator
CSSプロパティ |
説明 |
---|---|
トップ |
メインコントロールバー(デスクトップシステムおよびタブレットの場合)またはセカンダリコントロールバー(携帯電話の場合)の上の境界線からの位置(パディングを含む)。 |
右 |
メインコントロールバー(デスクトップシステムおよびタブレットの場合)またはセカンダリコントロールバー(携帯電話の場合)の右の境界線からの位置(パディングを含む)。 |
左 |
メインコントロールバー(デスクトップシステムおよびタブレットの場合)またはセカンダリコントロールバー(携帯電話の場合)の左の境界線からの位置(パディングを含む)。 |
下 |
メインコントロールバー(デスクトップシステムおよびタブレットの場合)またはセカンダリコントロールバー(携帯電話の場合)の下の境界線からの位置(パディングを含む)。 |
width |
ページインジケーターの幅。 |
height |
ページインジケーターの高さ。 |
color |
フォントカラー. |
font-family |
フォント名 |
font-size |
フォントサイズ |
例 — 56 x 28ピクセルで、水平方向に中央揃えしてメインコントロールバーの下から4ピクセルの位置に配置し、14ピクセルのHelveticaフォントを使用するページインジケーターを設定します。
.s7ecatalogsearchviewer .s7pageindicator {
position:absolute;
bottom: 4px;
margin-left: -28px;
left: 50%;
width:56px;
height:28px;
font-family: Helvetica;
font-size:14px;
}