>  기사  >  웹 프론트엔드  >  Chrome DevTools에서 팝오버 요소 Z-Index를 사라지지 않고 검사하는 방법은 무엇입니까?

Chrome DevTools에서 팝오버 요소 Z-Index를 사라지지 않고 검사하는 방법은 무엇입니까?

Patricia Arquette
Patricia Arquette원래의
2024-11-10 05:00:02211검색

How To Inspect Popover Element Z-Index in Chrome DevTools Without It Disappearing?

Chrome 개발자 도구에서 Popover 요소 Z-Index 검사: 화면 고정

Chrome 개발자 도구를 사용하여 Twitter Bootstrap 팝오버는 마우스를 멀리 이동하면 사라지기 때문에 어려울 수 있습니다. 이 문서에서는 팝오버를 일시적으로 일시 중지하고 관련 CSS를 수정하는 방법을 설명합니다.

방법:

  1. 브라우저에서 원하는 요소 위로 마우스를 가져가서 팝오버를 시작합니다. window.
  2. 팝오버가 계속 표시되는 동안 F8(또는 macOS의 경우 fn F8)을 눌러 화면을 고정합니다. 이 키바인드는 JavaScript 실행을 일시 중지하여 팝오버가 사라진 후에도 요소를 검사할 수 있도록 합니다.
  3. 개발자 도구에서 요소 탭으로 전환하세요.
  4. 팝오버의 HTML을 찾습니다. 트리거 요소의 중첩된 계층 구조 내의 요소.
  5. 필요에 따라 Z-인덱스 등 CSS 속성을 수정하여 팝오버의 위치를 ​​조정합니다.

위 내용은 Chrome DevTools에서 팝오버 요소 Z-Index를 사라지지 않고 검사하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.