Home > Web Front-end > JS Tutorial > JavaScript CSS control printing format example introduction_javascript skills

JavaScript CSS control printing format example introduction_javascript skills

WBOY
Release: 2016-05-16 17:05:07
Original
1414 people have browsed it

1. Use the css of media="print" to control the style of the file to be printed, testPrint.html, which refers to media as print, which means that the style will only take effect when printing

Copy the code The code is as follows:



//m.sbmmt.com/style/print.css file
Copy code The code is as follows:

.noprint{display:none;}

Using the style in print.css in testPrint.html, the effect will not be visible when browsing the web page , but it will work when printing, such as the following paragraph, after adding noprint, it is still realistic in the browser, but it will not be displayed when printing:
Copy the code The code is as follows:





Of course you can write whatever style you want in print.css and change the color (color image The effect is not good on a black and white printer, you can print in another style), any font or whatever, you can use it as you like--------------------------------- ------------------------------------------

2. Using JavaScript To control

For one reason or another, some people may not be very proficient in CSS, and some people are better at JavaScript. Sometimes JavaScript is also a good choice
Copy code The code is as follows:




This text will not be printed


Before printing, the window.onbeforeprint function will be called. At this time you Feel free to use your ingenuity to restructure the html and then print it. Of course, after printing, you usually have to get it back, which is the window.onafterprint function

-------------------------------- ----------------------------------

Tips: Pay attention, we all know about printing It is window.print(). In fact, you can also print frames, such as window.top.centerFrame.MainFrame.print();
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template