정의 및 사용
가시성 속성을 설정하거나 반환 요소를 볼 수 있는지 여부.
가시성 속성을 표시하거나 요소를 숨길 수있는 저자 수 있습니다. 그것은과 유사 디스플레이 속성입니다. 숨겨진 요소의 내용이 보이지 않는 것을 의미하지만 요소가 원래의 위치와 크기에 남아 : 없음 가시성 동안, 그것은 전체 요소를 숨 깁니다하지만, 차이점은 디스플레이를 설정하지 않는 경우이다.
브라우저 지원
가시성 속성은 모든 주요 브라우저에서 지원됩니다.
통사론
가시성 속성을 반환합니다 :
object .style.visibility
가시성 속성을 설정 :
object .style.visibility="visible|hidden|collapse|initial|inherit"
속성 값
| 값 | 기술 |
|---|---|
| visible | 요소는 가시적이다. 이 기본이다 |
| hidden | 요소는 표시되지 않지만 여전히 레이아웃에 영향을 미치는 |
| collapse | 테이블 행 또는 셀에서 사용하는 경우, 소자는 보이지 않는다 (same as "hidden") |
| initial | 기본값으로이 속성을 설정합니다. 초기 읽기에 대한 |
| inherit | 부모 요소에서이 속성을 상속합니다. 대한 상속 읽기 |
기술적 세부 사항
| 기본값: | 명백한 |
|---|---|
| 반환 값 : | 요소의 내용이 표시할지 여부를 나타내는 문자열, |
| CSS 버전 | CSS2 |
더 예
예
디스플레이 속성과 가시성 속성의 차이 :
function demoDisplay() {
document.getElementById("myP1").style.display = "none";
}
function demoVisibility() {
document.getElementById("myP2").style.visibility = "hidden";
} »그것을 자신을 시도 예
숨기기 및 표시 <img> 요소를 :
function hideElem() {
document.getElementById("myImg").style.visibility = "hidden";
}
function showElem() {
document.getElementById("myImg").style.visibility = "visible";
} »그것을 자신을 시도 관련 페이지
CSS 자습서 : CSS 디스플레이 및 가시성
CSS 참조 : visibility property
<스타일 개체