[HTML] div 표시 및 숨기기

4263 단어 HTML수필.

div를 숨기는 몇 가지 흔한 방법

  • 1.display:none;
  • 2.visibility:hidden;
  • 3.background-color:transparent;아니면 배경과 같은 색으로 설정하면 됩니다
  • 4.opacity에서 불투명 단계를 설정합니다. 호환성 필터에 주의하십시오...
  • 5.div에margin 마이너스 값을 주십시오. 이 마이너스 값은div 자체의 높이나 너비
  • 와 꼭 같습니다.
  • 6.두 개의 크기가 같은div를 설정하여 첫 번째는 왼쪽으로 이동하고 두 번째는 움직이지 않으면 두 번째div를 숨깁니다
  • 7.부div와 부div를 설정하고 부div는 절대적으로 위치를 정한다. 부div는 상대적으로 위치를 정한다. 부div의left는 부div의 너비
  • 이다.
  • 8.아바마마div1에 고정된 너비를 설정하고 아바마마div2에 고정된 너비를 설정하며 아바마마div1에 오버플로우:hidden을 설정하고 아바마마div1에 숨겨지지 않은 나머지 너비를 설정합니다. 코드는 다음과 같습니다.
  • #div1{width:100px;height:200px;overflow:hidden;} 
    #div2{width:200px;height:200px;background:green;margin-left:100px;} 
    
  • 9.div의 너비와 높이를 0
  • 으로 설정합니다.

    1. div의visibility는div의 표시와 숨기기를 제어할 수 있지만 숨기면 페이지가 공백으로 표시됩니다.

    style="visibility: none;"
    document.getElementById("typediv1").style.visibility="hidden";//  
    document.getElementById("typediv1").style.visibility="visible";//  
    

    2. display 속성을 설정하면div가 숨겨진 후에 차지하는 페이지 공간을 방출할 수 있습니다. 다음과 같습니다.

    style="display: none;"
    document.getElementById("typediv1").style.display="none";//  
    document.getElementById("typediv1").style.display="";// 
    
  • display:none과visibility:hidden의 차이점:https://blog.csdn.net/qq_41846861/article/details/88600664
  • 좋은 웹페이지 즐겨찾기