Bootstrap 드롭다운 메뉴가 IE7의 다른 요소 뒤에 나타나는 이유는 무엇입니까?

IE7에서 다른 요소 뒤에 나타나는 Bootstrap 드롭다운 메뉴

Bootstrap 드롭다운 메뉴가 웹사이트의 다른 요소 뒤에 나타나는 문제에 직면해 있습니다. IE7에서는. 이 문제를 해결하려면 CSS의 스택 컨텍스트 개념을 이해해야 합니다.

스태킹 컨텍스트에서 요소는 z-index 속성에 따라 서로 상대적으로 배치됩니다. 그러나 현재 스택 컨텍스트 외부의 요소는 상호 작용하지 않습니다. 귀하의 경우, 드롭다운 메뉴는 동일한 스택 컨텍스트에 있지 않기 때문에 다른 요소 위에 나타나지 않습니다.

이 문제를 해결하려면 드롭다운 메뉴의 상위 요소에 z-index 속성을 추가할 수 있습니다. 그러면 새로운 스택 컨텍스트가 생성되고 드롭다운 메뉴가 다른 요소 위에 나타날 수 있습니다. HTML 코드에서 .header-top div는 이에 적합한 상위 요소입니다.

<code class="css">.header-top {
    z-index: 10000;
    position: relative;
}</code>

이렇게 하면 드롭다운 메뉴에 스택 컨텍스트가 있어 페이지의 다른 요소 위에 나타날 수 있습니다. .

위 내용은 Bootstrap 드롭다운 메뉴가 IE7의 다른 요소 뒤에 나타나는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!