PC에서 웹사이트 모바일 화면 보는 2가지 방법

Last Updated : 2023년 1월 11일

블로그를 하다보면 모바일 화면을 확인해야할 일이 종종 발생합니다.

핸드폰을 가지고 들어가보셔도 되지만 매번하기에 번거롭습니다.

지금부터 PC에서 글을 작성하고 바로 모바일 화면으로 확인하는 방법을 알려드릴까합니다.

이 방법을 이용하면 CSS 수정도 간편하게 하실 수 있으니 한번씩 해보세요.총 2가지 방법에 대해 알아볼 예정인데요.

하나는 “MicroSoft Edge“를 이용한 방법이고 나머지하나는 “Chrome“을 이용한 방법입니다.

설치가 되어 있지 않으신 분들은 다운로드 후 설치부터 진행해주세요 🙂

그런데 둘 다 브라우저만 다를 뿐이지 방법이 동일하므로 하나로만 해보겠습니다. 어느걸 사용하셔도 됩니다.

PC에서 웹사이트 모바일 화면 보는 방법

먼저 “MicroSoft Edge“나 “Chrome“으로 인터넷창을 엽니다.

엣지

키보드에서 “F12“를 누릅니다.

오른쪽에 창이하나 생기는데 여기서 빨간표시한 곳을 “클릭” 합니다.

f12

반응형 페이지로 나오는걸 확인하실 수 있습니다.

왼쪽위의 “반응형” 부분을 눌러봅니다.

모바일 종류

다양한 종류의 모바일 기기들이 나옵니다. 제 핸드폰이 iPhone X이므로 iPhone X를 눌러보겠습니다.

모바일 화면으로 나오는걸 확인하실 수 있습니다. 오른쪽 위의 빨간 박스를 눌러보겠습니다.

PC에서-웹사이트-모바일화면-보기-완료

가로로도 잘나오네요.

가로

마치며

이상으로 PC에서 웹사이트 모바일 화면 보는 2가지 방법에 대해 알아봤습니다.

아래 관련글도 많은 관심 부탁드릴게요.

PC화면에서 스크롤 캡처하는 방법, 포맷 후 꼭 필요한 3DP 무료 다운로드에 관한 내용입니다.

관련글

error: 콘텐츠는 보호됩니다!!