DevTools 팁: DevTools를 여는 다양한 방법
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
Chrome DevTools를 여는 방법에는 여러 가지가 있습니다. 좋아하는 템플릿을 선택합니다.
마우스 오른쪽 버튼을 클릭하고 '검사'를 선택합니다.
페이지의 요소를 마우스 오른쪽 버튼으로 클릭하고 검사를 선택합니다.

> 도구 더보기 > 개발자 도구를 선택합니다.

단축키
키보드 사용자라면 다음 단축키 요약본을 참고하세요.
OS |
요소 |
콘솔 |
마지막 패널 |
Windows 또는 Linux |
Ctrl + Shift + C |
Ctrl + Shift + J |
F12 Ctrl + Shift + I |
Mac |
Cmd + Option + C |
Cmd + Option + J |
Fn + F12 Cmd + Option + I |
단축키를 쉽게 기억하는 방법은 다음과 같습니다.
- C는 CSS를 나타냅니다.
- JavaScript의 경우 J
- I는 선택을 나타냅니다.
Windows, Linux 또는 MacOS에서 Chrome DevTools를 자동으로 여는 방법을 알아보려면 모든 새 탭에서 DevTools 자동 열기를 참고하세요.
자세히 알아보기
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2022-10-26(UTC)
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2022-10-26(UTC)"],[],[]]