즐겨찾기 보기

즐겨찾기 보기는 축소판 이미지 열로 구성됩니다.

즐겨찾기 보기 컨테이너의 모양은 다음 CSS 클래스 선택기로 제어됩니다.

.s7ecatalogviewer .s7favoritesview

즐겨찾기 보기의 위치와 높이는 뷰로 관리됩니다. css에서는 너비를 정의할 수만 있습니다.

즐겨찾기 보기의 CSS 속성

배경색

즐겨찾기 보기의 배경색입니다.

width

보기의 폭입니다.

예 - 반투명 회색 배경을 사용하여 가로 100픽셀인 즐겨찾기 보기를 설정합니다.

.s7ecatalogviewer .s7favoritesview { 
 width: 100px; 
 background-color: rgba(221, 221, 221, 0.5); 
}

즐겨찾기 축소판 간의 간격은 다음 CSS 클래스 선택기로 제어됩니다.

.s7ecatalogviewer .s7favoritesview .s7thumbcell

즐겨찾기 축소판의 CSS 속성

margin

각 축소판 주위의 세로 여백 크기입니다. 실제 축소판 간격은 .s7thumbcell 에 대해 설정된 위쪽 및 아래쪽 여백의 합계와 같습니다.

예 - 10픽셀 간격을 설정합니다.

.s7ecatalogviewer .s7favoritesview .s7thumbcell { 
 margin: 5px; 
}

개별 축소판의 모양은 다음 CSS 클래스 선택기로 제어됩니다.

.s7ecatalogviewer .s7favoritesview .s7thumb

즐겨찾기 축소판의 CSS 속성

너비

축소판의 폭입니다.

height

축소판의 높이입니다.

경계

축소판의 테두리입니다.

노트

섬네일은 state 속성 선택기를 지원합니다. 이 선택기를 사용하면 다른 스킨(thumbnail states)을 다른 축소판 상태에 적용할 수 있습니다. 특히 state="selected"은 사용자가 최근에 선택한 축소판에 해당합니다. state="default" 축소판의 나머지 부분에 해당합니다. 및 state="over"은 마우스 가리키기에 사용됩니다.

예 - 75 x 75픽셀로 축소판을 설정하려면 밝은 회색의 기본 테두리와 어두운 회색으로 선택한 테두리를 사용합니다.

.s7ecatalogviewer .s7favoritesview .s7thumb { 
 width: 75px; 
 height: 75px;  
} 
.s7ecatalogviewer .s7favoritesview .s7thumb[state="default"] { 
 border: 1px solid #dddddd; 
} 
.s7ecatalogviewer .s7favoritesview .s7thumb[state="selected"] { 
 border: 1px solid #666666; 
}

축소판 레이블의 모양은 다음 CSS 클래스 선택기로 제어됩니다.

.s7ecatalogviewer .s7favoritesview .s7label

즐겨찾기 레이블의 CSS 속성

글꼴 패밀리

글꼴 이름.

font-size

글꼴 크기입니다.

예 - 14픽셀 Helvetica 글꼴로 레이블을 설정합니다.

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

이 페이지에서는