인쇄 - 보다 간단하게 특정 요소를 인쇄 안되게 하는 방법

인쇄용 CSS 파일을 독립적으로 만들지 않고 페이지 내에서 간단하게 특정 요소를 인쇄하지 않도록 하는 방법도 있습니다.

<style type="text/css"> <!-- @media print {     .advertising {display:none;} } //--> </style> <div class="advertising">광고</div> 본문

위와같이 HTML 문서를 제작하면 모니터상에서는 광고와 본문이 모두 보여지지만 인쇄화면에서는 광고는 보여지지 않고 본문만 출력이 됩니다.

인쇄미리보기 화면에서도 바로 확인할 수 있습니다.

물론 클래스(.advertising)를 사용하지 않고 앞의 강좌에서처럼 아이디(id)를 사용하여 광고와 메뉴 부분을 인쇄되지 않게 지정할 수 있습니다.

그리고 인쇄화면에서 보여지지 않게 하는 처리외에도 인쇄화면만의 스타일을 달리 적용할 수 있습니다.

즉 인쇄화면에서의 스타일을 지정하기 위해서는 @media print 라는 속성을 사용하여 일반적인 스타일과 구분을 해주는 겁니다

※출처 : http://www.homejjang.com/