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

인라인 확대/축소 모드 기본 보기는 정적 이미지, 정적 이미지 위에 플라이아웃 보기에 표시된 확대/축소 이미지 및 정적 이미지 위에 표시된 팁 메시지로 구성됩니다.

기본 뷰어 영역의 CSS 속성

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

.s7mixedmediaviewer .s7flyoutzoomview

CSS 속성

설명

배경색

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

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

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

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

.s7mixedmediaviewer .s7flyoutzoomview .s7tip

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

팁 메시지의 CSS 속성

CSS 속성

설명

배경색

메시지 배경 채우기 색입니다.

테두리 반경

메시지 배경 테두리 반경.

하단

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

color

팁 텍스트 색입니다.

font-size

글꼴 크기입니다.

font-family

글꼴 패밀리.

불투명도

메시지 배경 불투명도.

패딩

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

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

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

.s7mixedmediaviewer .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); 
}

이 페이지에서는