개발자도구를 이용하여 웹페이지 전체화면 캡쳐하기
인터넷 브라우저 마다 개발자도구를 사용할 수 있다. 또 개발자도구를 통하여 다양한 기능, 코드 확인 등을 할 수 있는 유용한 도구이다.
이번 포스팅은 제목에서 언급한것 처럼 개발자도구를 이용하여 웹페이 전체화면을 캡쳐해볼 생각이다.
다른 유틸프로그램 없이 가능합니다.
개발자도구 열기
개발자도구를 여는 방법은 3가지로 아래와 같다.
1)F12를 눌러서 연다
2)ctrl + shift + i 를 눌러서 연다
3)설정탭에서 도구더보기 -> 개발자 도구 를 눌러서 연다
1번, 2번의 방법으로 열지 못했을 경우 3번을 이용하면 접근이 가능하다
※개발자도구에 접근 못하도록 막아두는 웹페이지도 존재한다.
커맨드 창 열기
개발자도구에서 단축키 ctrl + shift + p를 눌러 커멘트 창에 접근한다.
단축키를 입력하면 위의 창이 뜬다.
캡쳐하기
명령어 capture를 입력하면 보라색으로 screenshot이 나온다. 스크린샷 기능중에서 하나를 골라서 선택하면 캡처를 할수 있다.
캡쳐 선택하기
캡처의 종류는 4가지로 다음과 같습니다.
1.영역 스크린샷 캡쳐(capture area screenshot) - 특정 영역에 스크린샷을 찍을 때 사용한다.
2.전체 크기 스크린샷 캡쳐(capture full size screenshot) - 웹페이지 문서 전체 화면이 찍힌다.
3.노드 스크린샷 캡쳐 (capture node screenshot) - 특정 노드(구조의 영역)을 찍습니다. 특정 노드를 입력해야 합니다.
4.스크린샷 캡쳐(capture screenshot) - 원하는 부분을 스크린샷 찍습니다.
원하는 영역으로 캡쳐가 가능하니 한번 사용해 보시면 좋을것 같습니다.
