CSS style printing is a frequently used printing method, which can be used to conveniently print specified content in the page and print by page, the following describes how to print with CSS styles.
[Analysis]:
1. Print Style Differentiation: Specifies the pattern of a media‑'print'. For example, create a bankprint.css printing Style File.
<LINK rel = "stylesheet" Media = "screen" type = "text/CSS" href = "/public/default/CSS/bank.css"/>
<! -- Print Style -->
<LINK rel = "stylesheet"Media = "print"Type = "text/CSS" href = "/public/default/CSS/bankprint.css"/>
Example:
<StyleMedia = 'print'>
. Noprint {display: none ;}
. Pagebreak {page-break-after: Always ;}
</Style>
Note:
Media is a CSS attribute media type used to directly Introduce media attributes. The syntax format is as follows:
@ Media screen | print | projection | Braille | aural | TV | handheld | all
Parameter description
Screen: a computer screen.
Print: Specifies the opaque media used for the printer.
Projection: displays projects.
Braille: a Braille system, a print with a tactile effect.
Aural: voice synthesizer.
TV: TV media.
Handheld: a handheld display device.
ALL: used for all media.
2. webbrowser Control
Like other controls, we first need to embed the webbrowser control in the page. However, this control is provided by IE browser and supports the default security settings of the browser, which avoids the trouble of security settings. For browsers with higher security requirements than IE7, you may need to customize the security level of IE.
<Object classid = "CLSID: 8856f961-340a-11d0-a96b-00c04fd705a2" id = "WB" width = "0" Height = "0"> </Object>
The following figure shows how to call the printing function of the control. You can call the control in javascrip:
Wb.exe CWB (6, 1); // print and print the current page
Wb.exe CWB (); // print preview
Wb.exe CWB (8, 1); // print settings, bring up the system print Settings dialog box
3. Set the header and footer: When printing, some must remove the header and footer, or replace it with what you want.
<Script language = "JavaScript">
VaR hkey_root, hkey_path, hkey_key;
Hkey_root = "HKEY_CURRENT_USER ";
Hkey_path = "\ Software \ Microsoft \ Internet Explorer \ pagesetup \\";
// Set the header and footer of Web Page printing to null
Function pagesetup_null (){
Try {
VaR regwsh = new activexobject ("wscript. Shell ");
Hkey_key = "Header ";
Regwsh. regwrite (hkey_root + hkey_path + hkey_key ,"");
Hkey_key = "footer ";
Regwsh. regwrite (hkey_root + hkey_path + hkey_key ,"");
// & B page & P/total & P page & B
} Catch (e ){}
}
// Configure the default value for the page header and footer
Function pagesetup_default (){
Try {
VaR regwsh = new activexobject ("wscript. Shell ");
Hkey_key = "Header ";
Regwsh. regwrite (hkey_root + hkey_path + hkey_key, "& W & B page number, & P/& P ")
Hkey_key = "footer ";
Regwsh. regwrite (hkey_root + hkey_path + hkey_key, "& U & B & D ");
} Catch (e ){}
}
...
</SCRIPT>
[Source code example]:
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> Print Settings </title>
<LINK rel = "stylesheet" Media = "screen" type = "text/CSS" href = "http://www.chinasvf.com/Webs/public/default/css/bank.css"/>
<! -- Print Style -->
<LINK rel = "stylesheet" Media = "print" type = "text/CSS" href = "http://www.chinasvf.com/Webs/public/default/css/bankprint.css"/>
<Script language = "JavaScript">
VaR hkey_root, hkey_path, hkey_key;
Hkey_root = "HKEY_CURRENT_USER ";
Hkey_path = "\ Software \ Microsoft \ Internet Explorer \ pagesetup \\";
// Set the header and footer of Web Page printing to null
Function pagesetup_null (){
Try {
VaR regwsh = new activexobject ("wscript. Shell ");
Hkey_key = "Header ";
Regwsh. regwrite (hkey_root + hkey_path + hkey_key ,"");
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
