축소 단추
마지막 업데이트: 2024년 7월 22일
작성 대상:
- 개발자
- 사용자
이 버튼을 선택하면 기본 보기의 이미지가 축소됩니다. 이 버튼은 화면 부동산을 저장하기 위해 휴대폰에는 표시되지 않는다. CSS를 사용하여 이 버튼의 크기를 조정하고, 스킨을 지정하고, 위치를 지정할 수 있습니다.
기본 뷰어 영역의 CSS 속성
버튼의 모양은 다음 CSS 클래스 선택기로 제어합니다.
.s7mixedmediaviewer .s7zoomoutbutton
CSS 속성 | 설명 |
---|---|
상위 | 패딩을 포함하여 위쪽 테두리에서 위치. |
오른쪽 | 패딩을 포함하여 오른쪽 테두리에서 위치. |
남음 | 패딩을 포함하여 왼쪽 테두리에서 위치. |
하단 | 패딩을 포함하여 아래쪽 테두리에서 위치합니다. |
너비 | 단추의 폭입니다. |
높이 | 단추의 높이입니다. |
배경 이미지 | 지정된 단추 상태에 대해 표시되는 이미지입니다. |
백그라운드 위치 |
CSS 스프라이트를 사용하는 경우 아트워크 스프라이트 내부에 배치합니다. CSS 스프라이트을(를) 참조하십시오. |
NOTE
이 단추는
state
특성 선택기를 지원하며, 이 선택기는 다른 단추 상태에 다른 스킨을 적용하는 데 사용할 수 있습니다.단추 도구 설명을 현지화할 수 있습니다. 자세한 내용은 사용자 인터페이스 요소의 지역화를 참조하십시오.
예 - 32x32픽셀이고 뷰어의 위쪽 및 오른쪽 가장자리에서 6픽셀을 배치하는 축소 단추를 설정합니다. 그리고 마지막으로, 는 네 개의 서로 다른 버튼 상태에 대해 각각 다른 이미지를 표시합니다.
.s7mixedmediaviewer .s7zoomoutbutton {
top:6px;
right:6px;
width:32px;
height:32px;
}
.s7mixedmediaviewer .s7zoomoutbutton [state='up'] {
background-image:url(images/v2/ZoomOutButton_dark_up.png);
}
.s7mixedmediaviewer .s7zoomoutbutton [state='over'] {
background-image:url(images/v2/ZoomOutButton_dark_over.png);
}
.s7mixedmediaviewer .s7zoomoutbutton [state='down'] {
background-image:url(images/v2/ZoomOutButton_dark_down.png);
}
.s7mixedmediaviewer .s7zoomoutbutton [state='disabled'] {
background-image:url(images/v2/ZoomOutButton_dark_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8