페이지의 나머지 부분에 영향을 주지 않고 CSS를 사용하여 특정 Div만 인쇄하려면 어떻게 해야 합니까?

다른 페이지 콘텐츠에 영향을 주지 않고 특정 Div 인쇄

페이지의 나머지 콘텐츠를 방해하지 않고 특정 div를 인쇄하는 작업을 수행할 수 있습니다. CSS를 사용하여. 이를 수행할 수 있는 방법은 다음과 같습니다.

CSS 전용 솔루션:

다음 CSS 코드 블록을 구현합니다.

@media print {
  body {
    visibility: hidden;
  }
  #section-to-print {
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
  }
}

방법 작동:

이 CSS 미디어 쿼리는 다음과 같은 경우 특정 스타일을 활성화합니다. 페이지가 인쇄되고 있습니다. 전체 본문 요소를 숨기고 ID가 "section-to-print"인 div만 표시됩니다. 또한 해당 div는 페이지의 왼쪽 상단에 절대적으로 위치하므로 제대로 인쇄됩니다.

CSS 사용의 이점:

• 간단하고 최소한의 코딩이 필요한 안정적인 솔루션입니다.
• CSS 가시성 속성은 상속과 자손을 모두 지원하므로 선택적으로 숨기거나 표시할 수 있습니다. 요소.
• 절대 위치 지정은 인쇄 레이아웃을 제어하여 원하는 div가 올바르게 인쇄되도록 보장합니다.

참고: 항상 브라우저의 인쇄에서 인쇄 스타일을 테스트하세요. 미리보기를 통해 의도한 대로 작동하는지 확인하세요. display:none 사용과 같은 대체 접근 방식은 더 복잡할 수 있으며 페이지 구조를 변경해야 할 수도 있습니다.

위 내용은 페이지의 나머지 부분에 영향을 주지 않고 CSS를 사용하여 특정 Div만 인쇄하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!