개발·웹
내 화면 해상도 확인 방법
게임, 동영상 설정, 고객 지원 양식에서 화면 해상도를 묻는데 찾은 숫자들이 서로 다릅니다. 실제 해상도를 찾고, 배율이 왜 값을 바꾸는지 알아보고, 브라우저 창 크기를 확인합니다. 어떤 컴퓨터, 태블릿, 휴대폰에서도 됩니다.
브라우저 확대/축소도 픽셀 비율을 바꿉니다. 먼저 Ctrl + 0(Mac은 Cmd + 0)을 눌러 확대/축소를 100%로 되돌리세요.
화면 해상도 열기이 한 자리
브라우저 확대/축소 되돌리기
페이지를 확대하거나 축소하면 브라우저가 알려 주는 값이 바뀝니다. Ctrl + 0, Mac에서는 Cmd + 0을 눌러 100%로 맞춥니다. 휴대폰에서는 손가락으로 원래 크기로 되돌립니다.
cv.cm 화면 해상도 열기
큰 숫자가 1920 × 1080처럼 실제 픽셀 기준 화면 해상도입니다. Full HD(1080p)나 4K UHD처럼 흔히 부르는 이름이 있으면 첫 줄에 나옵니다.
화면 해상도 열기CSS 픽셀과 배율 이해하기
Windows 125% 배율과 Retina 화면은 CSS 픽셀 하나에 실제 픽셀을 더 많이 써서 글자를 크게 보여 줍니다. 그 수를 알려 주는 것이 기기 픽셀 비율입니다. 1920 × 1080 화면을 125%로 쓰면 1536 × 864 CSS 픽셀, 비율 1.25로 나옵니다.
125% 배율에서는 실제 픽셀 1920 × 1080이 1536 × 864 CSS 픽셀로 나옵니다. 뷰포트 보기
브라우저 뷰포트는 창에서 페이지가 보이는 부분이며 CSS 픽셀로 나타냅니다. 창 크기를 바꾸면 바로 달라집니다. 웹 디자이너는 반응형 레이아웃에 이 크기를 씁니다.
화면, 작업 표시줄을 뺀 공간, 브라우저 안의 뷰포트. 다른 정보 확인하기
사용 가능한 화면은 작업 표시줄이나 Dock을 뺀 크기입니다. 화면비는 16:9나 16:10 같은 모양을 알려 주고, 방향과 색 깊이까지 보면 전체 모습을 알 수 있습니다. 휴대폰을 돌리면 값도 따라 바뀝니다.
고객 지원용으로 정보 복사하기
상세 정보 복사를 누르면 모든 줄을 텍스트로 복사합니다. 버그 신고나 고객 지원 채팅에 붙여 넣으면 상대방이 내 브라우저가 보는 그대로를 볼 수 있습니다.
자주 묻는 질문
Windows나 Mac에서 화면 해상도는 어디서 찾나요?
Windows의 설정 → 시스템 → 디스플레이에 나오는 값은 여기의 큰 숫자와 같습니다. Mac의 시스템 설정 → 디스플레이에는 '다음처럼 보임' 크기가 나오며, 이는 이 페이지의 CSS 크기입니다. 큰 숫자는 그 뒤의 실제 픽셀 수입니다.
웹사이트가 왜 내 화면을 실제보다 작다고 하나요?
웹사이트는 CSS 픽셀을 봅니다. 디스플레이 배율이 100%보다 크면 CSS 픽셀이 실제 픽셀보다 적습니다. 기기 픽셀 비율을 곱하면 실제 해상도가 나옵니다.
내 휴대폰 해상도는 얼마인가요?
휴대폰의 픽셀 비율은 2~3 이상이므로, 비율 3에서 390 × 844 CSS 픽셀로 나오는 휴대폰은 실제 픽셀이 1170 × 2532입니다.
뷰포트가 크면 화면도 큰 건가요?
아니요. 뷰포트는 브라우저 창의 페이지 영역일 뿐입니다. 창이 전체 화면이 아니거나 도구 모음이 공간을 차지하면 화면보다 작습니다.
모니터가 두 대일 때 값이 왜 안 맞나요?
페이지는 브라우저 창이 있는 화면을 읽습니다. 창을 다른 모니터로 옮기면 값이 바뀝니다.