CSS Stacking Context inspector 용 Google Chrome

Andrea Dragotta의 크롬용 CSS 스태킹 컨텍스트 인스펙터

CSS Stacking Context inspector는 Chrome용 devtools 확장으로, CSS 스택 컨텍스트를 쉽게 검사하고 z-index 전쟁을 해결할 수 있습니다. 두 친구의 도움으로 만들어졌는데 한 친구는 만들고 다른 한 친구는 코딩을 도왔습니다.

선택한 요소에 대한 모든 관련 정보를 보여주는 트리 기반 보기입니다. 개발자와 디자이너는 z-index 속성의 오용으로 인해 발생할 수 있는 문제를 해결하고 현재 상황을 확인하는 데 도움이 됩니다.

트리는 두 부분으로 구성됩니다. 왼쪽은 다음을 보여줍니다. 상위 스태킹 컨텍스트, 오른쪽은 하위 스태킹 컨텍스트를 보여줍니다. 이를 통해 트리를 검사하고 특정 z-색인 값이 있는 요소를 식별할 수 있습니다.