웹사이트에서 HTML 코드 복사

Rajeev Baniya 2023년6월20일

HTML HTML Inspect Element

이 기사에서는 Google Chrome의 Inspect Element를 사용하여 웹사이트에서 HTML 코드를 복사하는 방법을 소개합니다.

HTML 코드 복사를 검사하는 동안 `HTML로 편집` 옵션 사용

최신 웹 브라우저에는 사용자 또는 개발자가 웹 사이트에서 사용되는 HTML 콘텐츠 및 스타일을 볼 수 있는 검사 기능이 있습니다. HTML 내용을 복사하거나 HTML 내용을 조작하여 브라우저에서 결과를 볼 수도 있습니다.

하지만 이 방법으로는 웹 페이지를 검사하는 동안 볼 수 있는 코드를 직접 복사할 수 없습니다. 코드를 복사하는 몇 가지 단계가 있습니다.

예를 들어 웹사이트를 마우스 오른쪽 버튼으로 클릭하면 몇 가지 옵션이 표시됩니다. 옵션 끝에 검사가 표시됩니다.

검사 옵션을 클릭하거나 단축키 Ctrl+Shift+i를 사용합니다. 그런 다음 검사 도구가 화면 하단 또는 오른쪽에 열립니다.

검사 후 Inspector 탭의 검사 도구 왼쪽에서 HTML 코드를 볼 수 있습니다. 그런 다음 <html>을 마우스 오른쪽 버튼으로 클릭하고 HTML로 편집을 선택합니다.

또는 복사하려는 최상위 요소를 선택합니다. 그런 다음 웹 사이트의 필요한 HTML 콘텐츠를 복사합니다.

HTML로 편집 옵션을 거치지 않고 검사에서 직접 특정 HTML 콘텐츠를 복사할 수도 있습니다.

웹 사이트를 검사한 후 Inspector 탭의 왼쪽에서 HTML 콘텐츠를 볼 수 있습니다. 그런 다음 복사할 요소를 마우스 오른쪽 버튼으로 클릭하고 요소 복사 옵션을 선택할 수 있습니다.

그러면 해당 컨테이너 또는 섹션 내부의 전체 HTML 코드가 복사됩니다.

전체 코드를 복사하려면 <html>을 마우스 오른쪽 버튼으로 클릭하고 복사로 이동하여 요소 복사 옵션을 선택할 수 있습니다.

페이지 소스 보기 옵션 내에서 웹 사이트를 만드는 데 사용된 모든 HTML 콘텐츠를 볼 수 있습니다. 웹 사이트를 마우스 오른쪽 버튼으로 클릭하면 옵션이 나타납니다.

옵션 끝에 페이지 소스 보기 옵션이 표시됩니다. 옵션을 클릭하면 웹사이트의 모든 HTML 코드가 포함된 다른 탭이 열립니다.

그런 다음 HTML 코드를 선택하고 복사할 수 있습니다.

이들은 HTML 코드를 복사하는 다양한 방법입니다.