웹 페이지에서 특정 요소를 프린트할 때, 해당 요소를 확대 또는 축소하여 출력하고 싶을 때가 있습니다. 이를 자바스크립트를 사용하여 구현할 수 있습니다. 아래는 해당 기능을 구현하는 간단한 예제와 함께 설명하겠습니다.

요소 확대 출력하기

특정 요소를 확대하여 프린트하는 방법은 다음과 같습니다.

1. 프린트 스타일 시트를 추가한다. ```html

2. 프린트되는 요소에 클래스를 추가한다.
```html
<div class="zoomed-element">
  <!-- 확대하여 프린트할 내용 -->
</div>

1. 프린트 시에 확대된 요소가 출력되도록 설정한다.

   window.onbeforeprint = function() {
     var elements = document.getElementsByClassName('zoomed-element');
     for (var i = 0; i < elements.length; i++) {
    elements[i].style.transform = 'scale(1.5)'; /* 확대 비율 조절 */
     }
   };
   

요소 축소 출력하기

특정 요소를 축소하여 프린트하는 방법은 다음과 같습니다.

1. 프린트 스타일 시트를 추가한다. ```html

2. 프린트되는 요소에 클래스를 추가한다.
```html
<div class="zoomed-element">
  <!-- 축소하여 프린트할 내용 -->
</div>

1. 프린트 시에 축소된 요소가 출력되도록 설정한다.

   window.onbeforeprint = function() {
     var elements = document.getElementsByClassName('zoomed-element');
     for (var i = 0; i < elements.length; i++) {
    elements[i].style.transform = 'scale(0.8)'; /* 축소 비율 조절 */
     }
   };
   

위의 방법을 사용하여 자바스크립트로 웹 페이지의 특정 요소를 프린트 시에 확대 또는 축소하여 출력할 수 있습니다. 원하는 비율로 조절하여 프린트하고자 하는 요소를 보다 잘 표현할 수 있습니다.

참고 문헌:

• CSS transform Property
• WindowEventHandlers.onbeforeprint