HTML 웹개발자도구, 모바일 지원

Develop My Life·2020년 5월 13일
0

웹 개발자 도구

크롬 웹 개발자 도구를 통해 웹페이지의 html 문서와 그 부분이 어떻게 구성되어 있는지를 확인할 수 있다.

  • 알고 싶은 곳 -> 마우스 오른쪽 버튼 -> 검사
  • toggle device mode
    다양한 기기들이 나와 다양한 화면의 크기를 가지고 있다. 이 때 웹페이지가 다양한 화면 크기에서 어떻게 보이는 지를 확인할 수 있는 도구
  • Network
    웹 브라우저는 웹서버로부터 다운 받은 데이터를 보여주는 것이다. 이때 웹 브라우저가 다운로드 받는 과정을 확인 할 수 있는 도구이고 이것으로 무엇이 누락되었는지, 무엇 때문에 다운로드가 지연되는 지를 알 수 있다.

생활코딩 웹개발자도구 수업

모바일 지원

다양한 기기들이 나와 다양한 화면의 크기를 가지고 있는데 그러한 기기들에서도 최적화된 화면으로 웹페이지를 보여주기 위해서 해야하는 설정이다.
<meta name-"viewpoint" content="width = device-width, initial-scale = 1.0">
장치에 넓이를 맞추고 처음 시작 화면을 배율 1.0의 상태로 시작하라는 설정이다.

0개의 댓글