맥 : command + option + i

윈도우 : F12

🥨 https://developer.chrome.com/docs/devtools/device-mode?hl=ko

💊

스크린샷 2024-01-05 오후 7.01.36.png

💊  반응형 표시영역

스크린샷 2024-01-05 오후 6.00.02.png

💊

스크린샷 2024-01-05 오후 6.04.46.png

💊 미디어 쿼리 표시

스크린샷 2024-01-05 오후 6.07.00.png

상응하는 @media 선언을 찾으려면 중단점 사이를 마우스 오른쪽 버튼으로 클릭하고 Reveal in source code를 선택

스크린샷 2024-01-05 오후 6.08.21.png

💊

스크린샷 2024-01-05 오후 5.38.09.png

💊

스크린샷 2024-01-05 오후 5.36.41.png

💊

스크린샷 2024-01-05 오후 5.35.33.png

💊 기기 픽셀 비율 설정

기기 픽셀 비율 (DPR)은 하드웨어 화면의 실제 픽셀과 논리 (CSS) 픽셀 간의 비율입니다. 즉, DPR은 CSS 픽셀을 그리는 데 사용할 화면 픽셀 수를 Chrome에 알립니다. Chrome은 HiDPI (High Dots Per Inch) 디스플레이에 그릴 때 DPR 값을 사용합니다.

스크린샷 2024-01-05 오후 6.16.50.png

💊 표시 영역을 가로 모드 방향으로 회전