[css] 인쇄 스타일 시트 디버깅에 대한 제안?

HTML에서 PDF로 접근하지 않고 가능한 한 인쇄 된 창을 최대한 제어하고 싶다고 가정합니다 … @media screen을 사용하여 디버깅하십시오-@media print for final css

현대 브라우저는 당신에게 사용하여 인쇄 시간에 무슨 일이 일어날에 대한 빠른 시각적으로 제공 할 수 있습니다 인치 와 점 A의를 @media query.

@media screen and (max-width:8.5in) { /* resize your window until the event is triggered */
    html { width:8.5in; }
    body { font: 9pt/1.5 Arial, sans-serif; } /* Roughly 12px font */
 ...
}

브라우저에 “인치”가 표시되면 무엇을 기대해야하는지 더 잘 알 수 있습니다. 이 방법은 인쇄 미리보기 방법을 모두 종료해야합니다. 모든 프린터에서 작동 pt및 in단위, 그리고 @media 기술을 사용하면 신속하게 발생하고 그에 따라 조정 무슨 일이 일어나고 있는지 볼 수 있습니다. Firebug (또는 이와 동등한)는 해당 프로세스를 신속하게 처리합니다. @media에 변경 사항을 추가하면 media = "print"속성을 사용하여 연결된 CSS 파일에 필요한 모든 코드가 있습니다 . @media 화면 규칙을 참조 된 파일에 복사 / 붙여 넣기 만하면됩니다.

행운을 빕니다. 웹은 인쇄용으로 제작되지 않았습니다. 모든 컨텐츠를 제공하는 솔루션을 작성하면 브라우저에서 보이는 것과 동일한 스타일이 때때로 불가능할 수 있습니다. 예를 들어, 주로 1280 x 1024 청중을위한 유동적 인 레이아웃이 항상 멋지고 깔끔한 8.5 x 11 레이저 인쇄로 쉽게 변환되는 것은 아닙니다.

purusal에 대한 W3C 참조 : http://www.w3.org/TR/css3-mediaqueries/

답변