크롬에서 요소 검사하는 방법

PDF download PDF 다운로드
공동 작성자 Luigi Oppido

PDF download PDF 다운로드

이 글은 컴퓨터를 사용하여 구글 크롬에서 어느 웹 페이지든지 시각적 요소의 HTML 소스 코드를 검사하는 방법을 알려준다.

단계

PDF download PDF 다운로드
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/bf\/Inspect-Element-on-Chrome-Step-1-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-1-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/bf\/Inspect-Element-on-Chrome-Step-1-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-1-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    크롬 아이콘은 가운데 파란색 점이 있고 여러색이 들어간 공 모양이다. 맥에서는 어플리케이션 폴더에서 찾을 수 있고, 윈도우에서는 시작 메뉴에서 찾을 수 있다.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b1\/Inspect-Element-on-Chrome-Step-2-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-2-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b1\/Inspect-Element-on-Chrome-Step-2-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-2-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    브라우저 창 오른쪽 상단의 주소창 옆에 있는 버튼이다. 누르면 드롭다운 메뉴가 뜬다.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/05\/Inspect-Element-on-Chrome-Step-3-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-3-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/05\/Inspect-Element-on-Chrome-Step-3-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-3-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    그러면 밑에 메뉴가 뜬다.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/24\/Inspect-Element-on-Chrome-Step-4-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-4-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/24\/Inspect-Element-on-Chrome-Step-4-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-4-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    그러면 브라우저 창 오른쪽에 검사창이 뜬다.
    • 키보드 단축키로 검사창을 열수도 있다. 맥에서는 ⌥ Option + ⌘ Cmd + I , 윈도우에서는 Ctrl + Alt + I 를 누른다.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/0f\/Inspect-Element-on-Chrome-Step-5-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-5-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/0f\/Inspect-Element-on-Chrome-Step-5-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-5-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    요소나 검사창에 써있는 줄에 마우스를 가져다 대면 웹 페이지에 선택된 요소가 하이라이트 표시된다.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/ad\/Inspect-Element-on-Chrome-Step-6-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-6-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/ad\/Inspect-Element-on-Chrome-Step-6-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-6-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    오른쪽 클릭하면 나오는 메뉴가 드롭다운 박스로 뜬다.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/20\/Inspect-Element-on-Chrome-Step-7-Version-2.jpg\/v4-460px-Inspect-Element-on-Chrome-Step-7-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/20\/Inspect-Element-on-Chrome-Step-7-Version-2.jpg\/v4-728px-Inspect-Element-on-Chrome-Step-7-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    그러면 선택된 요소로 검사창이 움직이고 해당되는 소스 코드가 하이라이트로 표시된다.
    • 검사창을 일부러 열지 않아도 된다. 오른쪽 버튼을 눌러 나오는 메뉴에서 검사하기 를 누르면 검사창이 열린다.
    광고

관련 위키하우

내 컴퓨터의 IP 주소 찾는 법
JPG 파일 PNG로 변환하는 법
PDF 번역하는 방법
유튜브에서 음악 다운로드하기
와이파이 비밀번호 변경하는 법
인스타그램 팔로워 천 명 만들기
특정 웹사이트가 안 열릴 때 해결하는 법
페이스북 고객센터 연락하는 법
디스코드에서 친구를 추가하는 방법
인스타그램 계정 복구하는 방법
유튜브 비디오 다운받는 방법
스포티파이에서 음악 다운받는 법
공유기 두 대 연결하는 법
스마트 TV에 인터넷을 연결하는 방법
광고

이 위키하우에 대하여

다른 언어
이 문서는 9,770 번 조회 되었습니다.

이 글이 도움이 되었나요?

광고