Firefox의 웹 페이지 내에 스크롤 요소가 포함 된 스크린 샷을 만드는 방법은 무엇입니까?

전체 웹 페이지의 스크린 샷을 찍어야합니다. 요령은 화면에 맞지 않는 단일 요소의 전체 내용을 포함하기 위해 스크린 샷이 필요하다는 것입니다.

높이 때문에 스크롤 막대가있는 단일 열 테이블입니다. IFRAME이 아닙니다 (자체 탭에 간단하게로드 할 수 있음).

이 열에는 형식이 지정된 텍스트와 몇 개의 작은 이미지가 포함됩니다.

스크롤되는 긴 웹 페이지의 경우이 작업을 수행하는 것이 쉽지 않습니다. 그러나 스크롤하는 페이지 내에 개별 요소가 포함되어 있으면 어떻게 달성 할 수 있습니까?

분명히하기 위해 요소 자체뿐만 아니라 전체 페이지를 캡처해야합니다.

Windows에서 Firefox를 사용 하여이 작업을 수행하고 싶습니다.

내 제안은 단일 DOM 요소의 스크린 샷을 찍을 수 있는 Firefox의 내장 기능 을 사용하는 것입니다.

개발자 도구를 열고 → 요소 찾기 → 마우스 오른쪽 버튼을 클릭하고 스크린 샷 찍기

내부 사이트 중 하나에서 작동하지 않았으므로 모든 사이트에서 작동한다고 말할 수는 없습니다.

OP 편집 후 업데이트 :

아래와 같이 전체 DOM 요소 내용과 함께 전체 페이지를 기록하려면 DOM 요소의 높이를 실시간으로 편집해야 하지만 ...

그것은 많은 DOM 요소를 뷰포트와 스크린 샷 또는 AFAIK에서 다른 도구로 캡처하지 못하도록 밀어 넣을 것입니다.

https://en.wikipedia.org/wiki/Screenshot 에서 아래를 읽으십시오.

스크린 샷, 화면 캡처, 화면 캡, 캡, 화면 덤프 또는 화면 캡처는 사람이 모니터, 텔레비전 또는 사용중인 기타 시각적 출력 장치에 표시되는 보이는 항목을 기록하기 위해 찍은 이미지입니다.

실제로 그렇게해야한다면 GIF를 만들거나 두 페이지의 스크린 샷을 하나의 전체 페이지와 다른 하나의 DOM 요소로 병합하여 하나의 이미지로 병합합니다.

개발자 툴바에서 스크린 샷 명령을 ​​사용할 수 있습니다.

1. Shift+ F2를 눌러 도구 모음을 열거 나 웹 개발자 도구 메뉴에서 선택하십시오.

2. 도구 모음에서 명령을 입력하십시오 screenshot --fullpage fullpage.png.

단일 요소를 캡처하려면 --selector 플래그와 함께 CSS 선택기를 사용할 수 있습니다.

screenshot --selector #hot-network-questions

아래 이미지를 얻을 것입니다

Firefox의 반응 형 디자인 모드 를 사용하여 너비를 일반적인 것으로 설정하고 전체 페이지를 충분히 포함 할 수 있도록 높이를 설정 한 다음 스크린 샷 버튼 (카메라 아이콘)을 클릭하십시오.

문제를 해결할 수있는 Snagit 이라는 소프트웨어 가 있습니다. 이 소프트웨어는 스크롤 창과 같은 다양한 유형의 스크린 샷을 찍을 수 있으며 비디오를 녹화 할 수도 있습니다.

유료 응용 프로그램이지만 시험판도 사용할 수 있습니다.

Screenpresso를 사용 합니다. 스크롤 스크린 샷을 만들 수 있습니다. 기본적으로 스크린 샷을 찍고 아래로 스크롤하여 다른 스크린 샷을 찍은 다음 Screenpresso가 함께 연결합니다. Screenpresso도 무료입니다.

참고로, 스크린 샷 스크롤 단축키는 WindowsKey + Shift + PrintScreen입니다. 그런 다음 스크롤하려는 창을 클릭해야합니다. 다음 부분의 스크린 샷을 보려면 마우스 오른쪽 버튼을 클릭하고 아래로 스크롤 한 다음 마우스 오른쪽 버튼을 클릭하십시오. 완료되면 왼쪽 클릭하면 서로 연결됩니다. 스티칭 프로세스가 더 잘 작동 할 수 있도록 각 스크린 샷에 겹치도록하십시오.

가 확장 이라는 후광 화면 캡처 이 작업에 매우 적합하다.

다음을 캡처 할 수있는 옵션이 있습니다.

• 페이지의 보이는 부분 ( alt+ 와 반대로 브라우저 요소를 포함하지 않는 데 유용함 Print Scrn)
• 페이지 조각 (원하는 조각을 찾기 위해 화면의 영역 위로 마우스를 가져갈 수 있음-이 영역은 기본 HTML 요소에 해당)
• 선택한 영역 (스크린 샷을 원하는 위치를 수동으로 클릭하고 드래그하고 드래그하는 동안 스크롤 지원)
• 전체 페이지

한 페이지에 모든 것을 맞추는 옵션 :

• <Ctrl>-한 페이지에 모든 것을 맞추는 데 사용
• 화면을 세로 모드로 회전
• 세로 모드에서 두 번째 화면을 사용하고 첫 번째 화면 아래에 위치
• 위의 모든 것을 결합하십시오

다른 옵션은 캡처하려는 부분의 상단을 스크린 샷으로 찍는 것입니다. 아래로 스크롤하여 다음 스크린 샷을 찍습니다. 모든 것을 포착 할 때까지이 과정을 반복하십시오.
선택 사항 : 이미지 편집기 (예 : 김프)를 사용하여 스크린 샷을 하나의 큰 이미지로 결합합니다.

스크린 샷을 만들려면 easy screenshot과 같은 확장 프로그램을 추가 할 수 있습니다. 그러면 스크린 샷을 찍는 것이 훨씬 쉬울 것입니다.

스크롤 창이있는 DESKTOP 프로그램의 경우 ApowerSoft 캡처 가 나를 위해 일했습니다.