페이지 인쇄에 window.print ()를 사용하고 있지만 머리글과 바닥 글에 페이지 제목, 파일 경로, 페이지 번호 및 날짜가 포함되어 있습니다. 그들을 제거하는 방법?
인쇄 스타일 시트도 시도했습니다.
#header, #nav, .noprint
{
display: none;
}도와주세요. 감사.
답변
Chrome에서는 다음을 사용하여이 자동 머리글 / 바닥 글을 숨길 수 있습니다.
@page { margin: 0; }내용이 페이지의 한계까지 확장되므로 페이지 인쇄 머리글 / 바닥 글이 없습니다. 물론이 경우 본문 요소에 여백 / 패딩을 설정하여 콘텐츠가 페이지 가장자리까지 확장되지 않도록해야합니다. 일반 프린터는 여백없는 인쇄를 얻을 수없고 원하는 것이 아닐 수 있으므로 다음과 같이 사용해야합니다.
@media print {
@page { margin: 0; }
body { margin: 1.6cm; }
}으로 마틴 의견에서 지적, 페이지 경우 (큰 테이블 등의) 한 페이지 과거 스크롤, 여백이 무시됩니다 긴 요소를 가지고 인쇄 된 버전은 이상하게 보일 것이다.
이 답변의 원본 (2013 년 5 월) 당시에는 Chrome에서만 작동했으며 지금은 확실하지 않으며 다시 시도 할 필요가 없습니다. 할 수없는 브라우저에 대한 지원이 필요한 경우 즉시 PDF를 만들어 인쇄 할 수 있지만 (자바 스크립트가 포함 된 자체 인쇄 PDF를 만들 수 있음) 이는 매우 번거 롭습니다.
답변
이 코드를 CSS 파일에 추가하면 문제가 해결 될 것이라고 확신합니다.
<style type="text/css" media="print">
@page
{
size: auto; /* auto is the initial value */
margin: 0mm; /* this affects the margin in the printer settings */
}
</style>답변
Firefox :
moznomarginboxes속성 추가<html>
예 :
<html moznomarginboxes mozdisallowselectionprint>답변
오늘 제 동료도 같은 문제를 우연히 발견했습니다.
그러나 “margin : 0″솔루션은 크롬 기반 브라우저에서 작동하므로 Internet Explorer 는 @page 여백이 0으로 설정되어 있어도 바닥 글을 계속 인쇄합니다.
해결책은 (더 많은 해킹) @page에 마이너스 마진을 두는 것이 었습니다.
@page {margin:0 -6cm}
html {margin:0 6cm}음의 여백은 Y 축에서는 작동하지 않으며 X에서만 작동합니다.
도움이되기를 바랍니다.
답변
CSS 표준은 일부 고급 서식을 활성화합니다. CSS에는 페이지가있는 미디어 (예 : 종이)에만 적용되는 일부 형식을 활성화하는 @page 지시문이 있습니다. http://www.w3.org/TR/1998/REC-CSS2-19980512/page.html을 참조 하십시오 .
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Print Test</title>
<style type="text/css" media="print">
@page
{
size: auto; /* auto is the current printer page size */
margin: 0mm; /* this affects the margin in the printer settings */
}
body
{
background-color:#FFFFFF;
border: solid 1px black ;
margin: 0px; /* the margin on the content before printing */
}
</style>
</head>
<body>
<div>Top line</div>
<div>Line 2</div>
</body>
</html>파이어 폭스의 경우 사용
Firefox에서 https://bug743252.bugzilla.mozilla.org/attachment.cgi?id=714383 (페이지 소스보기 :: 태그 HTML).
당신의 코드에서 교체 <html>로<html moznomarginboxes mozdisallowselectionprint>.
답변
@media print {
.footer,
#non-printable {
display: none !important;
}
#printable {
display: block;
}
}답변
이것이 가장 간단한 해결책이 될 것입니다. 나는 인터넷에서 대부분의 솔루션을 시도했지만 이것이 도움이되었습니다.
@print{
@page :footer {color: #fff }
@page :header {color: #fff}
}