This time I will show you how to use JS to implement paging printing, and what are the precautions for using JS to implement paging printing. The following is a practical case, let’s take a look.
When callingwindow.print(), the printing effect can be achieved, but when there is too much content, page printing is required.
page-break-before and page-break-after CSS properties will not Modify the display of web pages on the screen. These two properties are used to control how the file is printed.
<HTML> <HEAD> <TITLE>Listing 14-4</TITLE> </HEAD> <BODY> <p>This is the first p.</p> <p STYLE="page-break-before:always">This is the second p.</p> <p STYLE="page-break-after:always">This is the third p.</p> <p>This is the fourth p.</p> <p STYLE="page-break-before:right">This is the fifth p.</p> <p STYLE="page-break-after:right">This is the sixth p.</p> <p>This is the last p.</p> </BODY> </HTML>
| Description | |
| Default value. If necessary, insert a page break before the element | |
| Insert a page break before the element | |
| Avoid inserting page breaks before elements | |
| Insert enough page breaks before elements until there is a blank left page | |
| Enough page breaks before the element, all the way to a blank right page | |
| Specifies that the setting of the page-break-before attribute should be inherited from the parent element |
Object.style.pageBreakBefore=auto|always|avoid|left|right
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><html>
<head>
<script type="text/javascript">
function setPageBreak()
{
document.getElementById("p2").style.pageBreakBefore="always";
}
</script>
</head>
<body>
<p>This is a test paragraph.</p>
<input type="button" onclick="setPageBreak()" value="Set page-break" />
<p id="p2">This is also a test paragraph.</p>
</body>
</html></pre><div class="contentsignin">Copy after login</div></div> I believe you have mastered the method after reading the case in this article, please pay attention for more exciting things Other related articles on php Chinese website!
Recommended reading:
How to deal with Mac installation thrift error due to bisonHow to correctly handle Taobao cnpm after installing cnpm is not Internal or external commandThe above is the detailed content of How to use JS to implement paging printing. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
