플라이아웃 확대/축소 보기

기본 보기는 정적 이미지, 정적 이미지 맨 위의 플라이아웃 보기에 표시된 확대 이미지, 정적 이미지 맨 위에 표시된 팁 메시지로 구성됩니다.

기본 보기의 CSS 속성

기본 보기의 모양은 다음 CSS 클래스 선택기로 제어됩니다.

.s7flyoutviewer .s7flyoutzoomview

CSS 속성

설명

배경색

기본 보기의 배경색입니다.

예 - 기본 보기를 투명하게 만들려면:

.s7flyoutviewer .s7flyoutzoomview { 
 background-color: transparent; 
}

팁 메시지의 CSS 속성

팁 메시지의 모양은 다음 CSS 클래스 선택기로 제어됩니다.

.s7flyoutviewer .s7flyoutzoomview .s7tip

CSS를 통해 글꼴 스타일, 크기 모양 및 세로 오프셋을 구성할 수 있습니다. 그러나 가로 맞춤은 뷰어 논리에 의해 관리됩니다. left 또는 right 속성을 사용하여 CSS를 통해 재정의하는 것은 지원되지 않습니다.

CSS 속성

설명

하단

기본 뷰의 하단에서 오프셋합니다.

color

텍스트 색상.

font-family

글꼴 이름.

font-size

글꼴 크기입니다.

패딩

메시지 텍스트 주위에 패딩합니다.

배경색

메시지 텍스트의 배경색 채우기 색입니다.

테두리 반경

메시지 텍스트의 배경 테두리 반경.

불투명도

메시지 텍스트의 배경 불투명도입니다.

Internet Explorer 8의 경우 filter:alpha(opacity-..) 사용

팁 메시지는 현지화할 수 있습니다. 자세한 내용은 사용자 인터페이스 요소 현지화를 참조하십시오.

.

예 - 흰색 Arial 12px 글꼴로 반투명 팁 메시지를 설정하려면 기본 보기 아래쪽에서 50픽셀 오프셋하고 패딩과 반올림된 테두리를 설정합니다.

.s7flyoutviewer .s7flyoutzoomview .s7tip { 
bottom: 50px; 
color: #ffffff; 
font-family: Arial; 
font-size: 12px; 
padding-bottom: 10px; 
padding-top: 10px; 
padding-left: 12px; 
padding-right: 12px; 
background-color: #000000; 
border-radius: 4px; 
opacity: 0.5; 
filter: alpha(opacity = 50); 
}

이 페이지에서는