>source

항상 다른 모든 것 위에 헤더가있는 웹 페이지를 만들려고합니다. 팝업에 부트 스트랩 모달을 추가하면 헤더를 덮는 회색 영역이 있습니다.

나는 설정을 시도했다 z-index 내 빨간색 배경 헤더 요소와 모달 팝업 요소 모두에 대해 모달 회색 상자가 내가 피하려고하는 내 빨간색 탐색 모음 위에 표시됩니다.

https://jsfiddle.net/martinradio/u03f1zyo/21/

  • 답변 # 1

    모달 팝업이 나타나면 DOM의 최상위 수준에 div 요소가 생성되고 비슷한 문제를 겪고 Z- 색인을 설정하여 해결했습니다.

    .modal-backdrop.show { z-index: 1000 !important; }

  • 답변 # 2

    헤더에는 기본 위치가 있습니다. 위치 : 정적;

    다음으로 변경하십시오.

    CSS

    header{
        position: relative;
        z-index: 1041;
    }
    
    

    이렇게하면 문제가 해결됩니다. 나중에 헤더를 고정하려면. 위치 : 고정도 작동합니다. 모달 상자 Z- 색인을 건드리지 말고 대신 케이스별로 구성 요소의 Z- 색인을 변경해야합니다.

관련 자료

  • 이전 python - 사용자 정의 변환기 내에서 sklearn 컬럼 변환기에 액세스하는 방법
  • 다음 python - 현재 스레드 번호 만 얻는 방법은 무엇입니까? (닫은)