js 컨트롤 숨 기 는 방법 및 display 속성 소개

자 바스 크 립 트 로 컨트롤 을 숨 기 는 방법 은 두 가지 가 있 습 니 다.컨트롤 을 설정 하 는 style 의'display'와'visibility'속성 입 니 다.style.display="block"또는 style.visibility="visible"일 때 컨트롤 이나 볼 수 있 습 니 다.style.display="none"또는 style.visibility="hidden"일 때 컨트롤 이 보이 지 않 습 니 다.다른 것 은'display'가 컨트롤 을 숨 길 뿐만 아니 라 숨겨 진 컨트롤 이 디 스 플레이 에서 사용 하 는 위 치 를 차지 하지 않 습 니 다.'visibility'숨겨 진 컨트롤 은 컨트롤 을 보이 지 않 게 설정 할 뿐 컨트롤 은 원래 의 위 치 를 차지 합 니 다. 

function displayHideUI()
{
     var ui = document.getElementById("bbs");
     ui.style.display="none";
}
function displayShowUI()
{
     var ui = document.getElementById("bbs");
     ui.style.display=" ";//display , block
}
function visibilityHideUI()
{
     var ui = document.getElementById("bbs");
     ui.style.visibility="hidden";
}
function visibilityShowUI()
{
     var ui = document.getElementById("bbs");
     ui.style.visibility="visible";
}
</script>
display:값                    설명 none                  이 요 소 는 표시 되 지 않 습 니 다.block                 이 요 소 는 블록 급 요소 로 표 시 됩 니 다.이 요 소 는 앞 뒤로 줄 바 꿈 문자 가 있 습 니 다.inline                묵인이 요 소 는 내 연 요소 로 표 시 됩 니 다.요소 앞 뒤 에는 줄 바 꿈 문자 가 없습니다.inline-block          줄 안의 블록 요소.(CSS 2.1 새로 추 가 된 값)list-item             이 요 소 는 목록 으로 표 시 됩 니 다.run-in                이 요 소 는 상하 문 에 따라 블록 급 요소 나 내 연 요소 로 표 시 됩 니 다.compact CSS           중 값 compact 가 있 지만 광범 위 한 지원 이 부족 하여 CSS 2.1 에서 삭제 되 었 습 니 다.marker CSS            값 marker 가 있 지만 광범 위 한 지원 이 부족 하여 CSS 2.1 에서 삭제 되 었 습 니 다.table                 이 요 소 는 블록 급 표 로 표 시 됩 니 다(과 유사).표 앞 뒤에 줄 바 꿈 문자 가 있 습 니 다.inline-table          이 요 소 는 내 연 표 로 표 시 됩 니 다(
과 유사).표 앞 뒤 에는 줄 바 꿈 이 없습니다.table-row-group       이 요 소 는 하나 이상 의 줄 의 그룹 으로 표 시 됩 니 다(와 유사).table-header-group    이 요 소 는 하나 이상 의 줄 의 그룹 으로 표 시 됩 니 다(와 유사).table-footer-group    이 요 소 는 하나 이상 의 줄 의 그룹 으로 표 시 됩 니 다(와 유사).table-row             이 요 소 는 표 줄 로 표 시 됩 니 다(와 유사).table-column-group    이 요 소 는 하나 이상 의 열의 그룹 으로 표 시 됩 니 다(과 유사).table-column          이 요 소 는 셀 로 표 시 됩 니 다(와 유사)table-cell            이 요 소 는 표 셀 로 표 시 됩 니 다(
와 유사)table-caption         이 요 소 는 표 제목 으로 표 시 됩 니 다(
과 유사)inherit               부모 요소 에서 display 속성 을 계승 해 야 하 는 값 을 규정 합 니 다.

좋은 웹페이지 즐겨찾기