반응형 웹, 모바일 웹 개발시 Chrome 에서 디바이스 ( 모바일 ) 모드로 사이즈별 화면 디자인 확인하기
Chrome 은 개발자에게 많은 편의사항을 제공하는대요. 여기서 설명하는 디바이스 모드도 그중 하나로 PC 용 Chrome 에서 반응형 웹이나 모바일 웹의 디자인을 확인할 수 있는 방법입니다. 물론 PC로 작업하기 때문에 Javascript 디버깅 및 CSS 임시 수정도 쉽게 가능합니다. 우선 페이지에서 우측 버튼을 클릭 후 '검사'를 눌러서 개발자 모드로 들어가시기 바랍니다. * 예전에는 '요소 검사' 였는데 안 본 사이에 변했네요. FireFox 랑 겹쳐서 그런가... FireFox는 그대로 '요소 검사'를 사용하고 있네요. 그리고 아래와 같이 '검사' 창의 좌측 상단에 있는 모바일 모양의 아이콘을 클릭해주시기 바랍니다. 이제 아래와 같이 디바이스 모드로 변경된 화면을 확인하실 수 있으실 것입니다. ..
Dev Tips/Dev Tool Tips
2015. 12. 11. 10:35
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
TAG
- 개발
- JavaScript
- 튜토리얼북
- Tutorialbook
- 서버
- 에러
- mac
- 게임 개발
- 설치
- php
- 게임
- 개발자
- it
- ubuntu
- 데이터베이스
- 웹 개발자
- Nodejs
- 우분투
- 웹
- 맥
- Developer
- 웹 서버
- 서버 개발
- SNS
- 인터넷
- cocos2d-x
- html
- Laravel
- Database
- 웹 개발
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
글 보관함