[크롬데브툴] Chrome DevTools의 단축키

바로 가기 키 - Chrome 개발자

Keyboard shortcuts - Chrome Developers

이 페이지는 Chrome DevTools의 바로 가기 키 참조입니다.

도구 설명에서 바로 가기를 찾을 수도 있습니다. DevTools의 UI 요소 위에 마우스를 올려 놓으면 해당 도구 설명이 표시됩니다. 요소에 바로 가기가 있으면 도구 설명에 바로 가기가 포함됩니다.

#DevTools 열기를 위한 바로 가기 키

DevTools를 열려면 커서가 브라우저 뷰포트에 초점을 맞추는 동안 다음 바로 가기 키를 누릅니다.

행동맥윈도우 / 리눅스

마지막으로 사용한 패널 열기	Command+Option+I	F12 또는 Control+Shift+I
콘솔 패널 열기	Command+Option+J	Control+Shift+J
요소 패널 열기	Command+Shift+C 또는 Command+Option+C	Control+Shift+C

#글로벌 키보드 단축키

다음 바로 가기 키는 전부는 아니더라도 대부분의 DevTools 패널에서 사용할 수 있습니다.

행동맥윈도우 / 리눅스

설정 표시	? 또는 Function+F1	? 또는 F1
다음 패널 초점 맞추기	Command+]	Control+]
이전 패널에 초점 맞추기	Command+[	Control+[
마지막으로 사용한 도킹 위치로 다시 전환합니다. DevTools가 전체 세션에 대해 기본 위치에 있는 경우 이 바로 가기는 DevTools의 도킹을 별도의 창으로 해제합니다.	Command+Shift+D	Control+Shift+D
장치 모드 전환	Command+Shift+M	Control+Shift+M
요소 검사 모드 전환	Command+Shift+C	Control+Shift+C
명령 메뉴 열기	Command+Shift+P	Control+Shift+P
서랍 토글	Escape	Escape
일반 다시로드	Command+R	F5 또는 Control+R
하드 다시로드	Command+Shift+R	Control+F5 또는 Control+Shift+R
현재 패널 내에서 텍스트를 검색합니다. 감사, 응용 프로그램 및 보안 패널에서 지원되지 않음	Command+F	Control+F
로드된 모든 리소스에서 텍스트를 검색할 수 있는 서랍에서 검색 탭을 엽니다.	Command+Option+F	Control+Shift+F
[소스] 패널에서 파일 열기	Command+O 또는 Command+P	Control+O 또는 Control+P
확대	Command+Shift++	Control+Shift++
축소	Command+-	Control+-
기본 확대/축소 수준 복원	Command+0	Control+0
스니펫 실행	+ 키를 눌러 명령 메뉴를 열고 스크립트 이름을 입력한 다음 키를 누릅니다. CommandO!Enter	+ 키를 눌러 명령 메뉴를 열고 스크립트 이름을 입력한 다음 키를 누릅니다. ControlO!Enter

#요소 패널 바로 가기 키

행동맥윈도우 / 리눅스

변경 실행 취소	Command+Z	Control+Z
변경 다시 실행	Command+Shift+Z	Control+Y
현재 선택한 요소 위/아래의 요소를 선택합니다.	Up Arrow / Down Arrow	Up Arrow / Down Arrow
현재 선택한 노드를 확장합니다. 노드가 이미 확장되어 있는 경우 이 바로 가기는 노드 아래의 요소를 선택합니다.	Right Arrow	Right Arrow
현재 선택한 노드를 축소합니다. 노드가 이미 축소된 경우 이 바로 가기는 노드 위의 요소를 선택합니다.	Left Arrow	Left Arrow
현재 선택한 노드와 노드의 모든 하위 노드를 확장하거나 축소합니다.	길게 누른 다음 요소 이름 옆에 있는 화살표 아이콘을 클릭합니다.Option	+ 키를 누른 다음 요소 이름 옆에 있는 화살표 아이콘을 클릭합니다.ControlAlt
현재 선택한 요소에서 속성 편집 모드 전환	Enter	Enter
속성 편집 모드로 들어간 후 다음/이전 속성을 선택합니다.	Tab / Shift+Tab	Tab / Shift+Tab
현재 선택한 요소 숨기기	H	H
현재 선택한 요소에서 편집을 HTML 모드로 전환	Function+F2	F2

#스타일 창 바로 가기 키

행동맥윈도우 / 리눅스

속성 값이 선언 된 줄로 이동하십시오.	속성 값을 누른 다음 클릭하십시오.Command	속성 값을 누른 다음 클릭하십시오.Control
색상 값의 RBGA, HSLA 및 Hex 표현을 순환합니다.	길게 누른 다음 값 옆에 있는 색상 미리 보기 상자를 클릭합니다.Shift	길게 누른 다음 값 옆에 있는 색상 미리 보기 상자를 클릭합니다.Shift
다음/이전 속성 또는 값 선택	속성 이름 또는 값을 클릭한 다음 Tab / Shift+Tab	속성 이름 또는 값을 클릭한 다음 Tab / Shift+Tab
속성 값을 0.1만큼 증분/감소	값을 클릭한 다음 Option+Up Arrow / Option+Down Arrow	값을 클릭한 다음 Alt+Up Arrow / Alt+Down Arrow
속성 값을 1만큼 증분/감소	값을 클릭한 다음 Up Arrow / Down Arrow	값을 클릭한 다음 Up Arrow / Down Arrow
속성 값을 10만큼 증분/감소	값을 클릭한 다음 Shift+Up Arrow / Shift+Down Arrow	값을 클릭한 다음 Shift+Up Arrow / Shift+Down Arrow
속성 값을 100만큼 증분/감소	값을 클릭한 다음 Command+Up Arrow / Command+Down Arrow	값을 클릭한 다음 Control+Up Arrow / Control+Down Arrow
각도 값의 도(deg), 그라디안(grad), 라디안(rad) 및 회전(회전) 표현을 통해 순환합니다.	길게 누른 다음 값 옆에 있는 각도 미리 보기 상자를 클릭합니다.Shift	길게 누른 다음 값 옆에 있는 각도 미리 보기 상자를 클릭합니다.Shift
각도 값을 1만큼 증분/감소	값 옆에 있는 각도 미리 보기 상자를 클릭한 다음 Up Arrow / Down Arrow	값 옆에 있는 각도 미리 보기 상자를 클릭한 다음 Up Arrow / Down Arrow
각도 값을 10만큼 증분/감소	값 옆에 있는 각도 미리 보기 상자를 클릭한 다음 Shift+Up Arrow / Shift+Down Arrow	값 옆에 있는 각도 미리 보기 상자를 클릭한 다음 Shift+Up Arrow / Shift+Down Arrow
각도 값을 15만큼 증분/감소	값 옆에 있는 각도 미리 보기 상자를 클릭한 다음 키를 누르고 각도 시계 오버레이에서 /마우스 슬라이드를 클릭합니다.Shift	값 옆에 있는 각도 미리 보기 상자를 클릭한 다음 키를 누르고 각도 시계 오버레이에서 /마우스 슬라이드를 클릭합니다.Shift

#소스 패널 바로 가기 키

행동맥윈도우 / 리눅스

스크립트 실행 일시 중지(현재 실행 중인 경우) 또는 다시 시작(현재 일시 중지된 경우)	F8 또는 Command+\	F8 또는 Control+\
다음 함수 호출 단계	F10 또는 Command+'	F10 또는 Control+'
다음 함수 호출로 들어가기	F11 또는 Command+;	F11 또는 Control+;
현재 기능에서 한 단계 제거	Shift+F11 또는 Command+Shift+;	Shift+F11 또는 Control+Shift+;
일시 중지된 상태에서 특정 코드 줄로 계속 진행합니다.	코드 줄을 길게 누른 다음 클릭하십시오.Command	코드 줄을 길게 누른 다음 클릭하십시오.Control
현재 선택한 프레임 아래 / 위의 호출 프레임을 선택하십시오.	Control+. / Control+,	Control+. / Control+,
로컬 수정 사항에 변경 내용 저장	Command+S	Control+S
모든 변경 내용 저장	Command+Option+S	Control+Alt+S
줄로 이동	Control+G	Control+G
현재 열려 있는 파일의 줄 번호로 이동	+ 키를 눌러 명령 메뉴를 열고 뒤에 줄 번호를 입력한 다음 키를 누릅니다. CommandO:Enter	+ 키를 눌러 명령 메뉴를 열고 입력 후 줄 번호를 누른 다음 ControlO:Enter
현재 열려 있는 파일의 열로 이동(예: 5행, 9열)	+ 키를 눌러 명령 메뉴를 열고 , , 줄 번호, 다른 , 열 번호를 입력 한 다음 키를 누릅니다. CommandO::Enter	+ 키를 눌러 명령 메뉴를 열고 , , 줄 번호, 다른 , 열 번호를 입력 한 다음 키를 누릅니다. ControlO::Enter
함수 선언 (현재 열려있는 파일이 HTML 또는 스크립트 인 경우) 또는 규칙 집합 (현재 열려있는 파일이 스타일 시트 인 경우)으로 이동하십시오.	++를 누른 다음 선언 / 규칙 집합의 이름을 입력하거나 옵션 목록에서 선택하십시오.CommandShiftO	++를 누른 다음 선언 / 규칙 집합의 이름을 입력하거나 옵션 목록에서 선택하십시오.ControlShiftO
활성 탭 닫기	Option+W	Alt+W

#코드 편집기 바로 가기 키

행동맥윈도우 / 리눅스

마지막 단어의 모든 문자 삭제(커서까지)	Option+Delete	Control+Delete
코드 줄 중단점 추가 또는 제거	커서를 선에 초점을 맞춘 다음 키를 누릅니다. Command+B	커서를 선에 초점을 맞춘 다음 키를 누릅니다. Control+B
일치하는 대괄호로 이동	Control+M	Control+M
한 줄 주석을 토글합니다. 여러 줄을 선택한 경우 DevTools는 각 줄의 시작 부분에 주석을 추가합니다.	Command+/	Control+/
커서가 어떤 단어에 있든 다음 항목을 선택 / 선택 취소하십시오. 각 발생은 동시에 강조 표시됩니다.	Command+D / Command+U	Control+D / Control+U

#성능 패널 바로 가기 키

행동맥윈도우 / 리눅스

녹화 시작/중지	Command+E	Control+E
녹음 저장	Command+S	Control+S
기록 불러오기	Command+O	Control+O

#메모리 패널 키보드 단축키

행동맥윈도우 / 리눅스

녹화 시작/중지

Command+E

Control+E

#콘솔 패널 바로 가기 키

행동맥윈도우 / 리눅스

자동 완성 제안 수락	Right Arrow 또는 Tab	Right Arrow 또는 Tab
자동 완성 제안 거부	Escape	Escape
이전 진술 가져오기	Up Arrow	Up Arrow
다음 문장 가져오기	Down Arrow	Down Arrow
콘솔 초점 맞추기	Control+`	Control+`
콘솔 지우기	Command+K 또는 Option+L	Control+L
여러 줄 입력을 강제 실행합니다. DevTools는 기본적으로 여러 줄 시나리오를 감지해야 하므로 이 바로 가기는 이제 일반적으로 필요하지 않습니다.	Command+Return	Shift+Enter
수행하다	Return	Enter
콘솔에 기록된 개체의 모든 하위 속성을 확장합니다.	길게 누른 다음 확장을 클릭하십시오.Alt	길게 누른 다음 확장을 클릭하십시오.Alt