[크롬] PC 화면을 스마트폰 화면 크기로 보는 방법
크롬 브라우저는 "개발자 도구"라는 아주 강력한 기능을 갖고 있어서 웹코딩을 하시는 분들께는 큰 도움이 되고 있습니다.
오늘 소개드리는 기능도 "개발자 도구"에 속하는 기능인데 일반적인 용도로 활용이 가능한 부분입니다.
웹코딩을 하시는 분들은 자신이 작성한 웹 화면이 스마트폰에서 어떻게 보일지 궁금할 것입니다.
요새는 대부분의 웹페이지들이 반응형 웹으로 작성되어 PC 화면뿐만 아니라 스마트폰, 태블릿 등과 같은 다양한 디바이스에 맞게 최적화되어 표시가 됩니다.
그러므로 자신이 작성한 웹페이지가 스마트폰에서 어떻게 보일지에 대해서 사전에 확인해 보기를 원할 것이고, 이때 활용할 수 있는 것이 바로 이 기능입니다.
물론 저희들 같이 웹페이지 코딩과 관계없는 분들도 요런 기능을 알아두면 다른 용도로 이용해 볼 수 있겠지요.
작동법은 민망할 정도로 간단합니다.
▼ PC 크롬 화면의 우측 상단에 있는 햄버거 아이콘을 누릅니다.
▼ "도구 더보기" → "개발자 도구"를 선택합니다.
( 이렇게 메뉴를 선택할 필요 없이 F12 버턴이나 "Ctrl+Shift+I"를 눌러도 됩니다.)
▼ 그러면 아래 화면과 같이 "크롬 개발자 도구"가 화면에 나타납니다.
▼ 화면 모양 아이콘을 누릅니다.
▼ 그러면 아래와 같이 화면이 스마트폰 화면으로 바뀝니다.
스마트폰을 터치하는 것처럼 커서를 움직이면 다음 화면으로 넘어갈 수 있습니다. 스마트폰과 동일하게 작동을 하게 됩니다.
어떻게 활용할 것인가?
블로그를 작성하시는 분들은 가끔 스마트폰 활용하는 방법에 대한 글을 사용할 때 스마트폰 화면을 캡처해서 이미지를 PC로 가져오는 번거로운 작업을 하게 되는데 이때 위와 같은 방법으로 PC상에서 바로 캡처해서 사용하면 굳이 이미지를 옮길 필요 없이 간단하게 작업을 할 수 있을 것 같습니다.
개인의 용도에 맞게 잘 사용하면 되겠지요...ㅎ
감사합니다.
이 글을 공유합시다
