Web浏览器中的打印兼容性

时间:2011-12-12 04:50:01

标签: html firefox google-chrome

我正在运行以下作为一个简单的html文件。问题是,当我在Firefox上运行它时,我得到一个不同于Chrome的视图,即表格中页面末尾的额外空间,以防铬,因为我在打印预览的最后得到额外的页面,我希望它看起来像firefox。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<!--last modified on Tuesday, June 05, 2001 08:55 AM -->
<HTML>

<HEAD>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">
    <META NAME="GENERATOR" Content="Visual Page 2.0 for Windows">
    <META NAME="Author" Content="NetCorrespondence.com">
    <TITLE>Printing Work Order</TITLE>
</HEAD>

<BODY>

<img src="/CFFileServlet/_cf_image/_cfimg5646601472618022292.PNG" alt="" />



<P>
<TABLE BORDER="2" CELLPADDING="0" CELLSPACING="0" WIDTH="100%" HEIGHT="100%"> 
    <TR>
        <TD WIDTH="100%" VALIGN="TOP">
            <TABLE BORDER="1" WIDTH="100%">
                <TR>
                    <TD WIDTH="50%"><b><font size="+1">&nbsp;</font></b></TD>
                    <TD WIDTH="50%">
                        <P ALIGN="RIGHT"><b>WORKORDER - Pest Control Services</b>
                    </TD>
                </TR>
                <TR>
                    <TD WIDTH="50%" VALIGN="TOP">

<table>
    <tr>
        <td><img src="http://209.123.166.68/E7CC71EB-756D-462F-9641B46BA6927E9B/pestlogo.jpg" alt="" width="100" height="125" border="0"></td>
        <td>
                    <FONT SIZE="5">

                                        Preferred Pest Services, Inc D/B/A Pest Pro Services


                    </FONT>


                    <BR>
                        32 Drysdale Street<BR>
                        Staten Island, NY, 10314<BR>
                        Tel:718 983-0004<BR>
                        Fax:718-477-0333&nbsp;&nbsp;Email:pestprosolutions@gmail.com
                        <BR>
                        Sales Representative: Debbie


        </td>
    </tr>
</table>


                        </TD>
                    <TD WIDTH="50%" VALIGN="TOP">
                        <DIV ALIGN="RIGHT">
                        <P>
                        <TABLE BORDER="1" CELLPADDING="0" CELLSPACING="0" WIDTH="95%">
                            <TR>
                                <TD><b>Order#:</b></TD>
                                <TD>&nbsp;92681</TD>
                            </TR>
                            <TR>
                                <TD><b>JobDate:</b></TD>
                                <TD>&nbsp;<b>10/07/2011</b></TD>
                            </TR>
                            <TR>
                                <TD><b>Day of Week:</b></TD>
                                <TD>&nbsp;<b>Friday</b></TD>
                            </TR>

                            <TR>
                                <TD><b>Location:</b></TD>
                                <TD>&nbsp;Manhattan</TD>
                            </TR>
                            <TR>
                                <TD><b>Start Time:</b></TD>
                                <TD>&nbsp;12:00 PM</TD>
                            </TR>
                            <TR>
                                <TD width="50%"><b>CFP:</b></TD>
                                <TD width="50%">&nbsp;&nbsp;</TD>                               
                            </tr>
                            <tr>
                                <TD width="50%"><b>CN:</b></TD>
                                <TD width="50%">&nbsp;&nbsp;</TD>
                            </TR>                                                       
                            <tr>
                                <TD width="50%"><b>Day Number:</b></TD>
                                <TD width="50%">&nbsp;1/1&nbsp;</TD>
                            </TR>                                                                                   


                        </table>
</DIV>
                    </TD>
                </TR>
                <TR>
                    <TD WIDTH="50%"><b>FOR OFFICE USE ONLY:</b></TD>
                    <TD WIDTH="50%">&nbsp;</TD>
                </TR>
                <TR>
                    <TD WIDTH="50%" VALIGN="TOP"><B>CUSTOMER INFORMATION:</B><BR><BR>
                        Company:&nbsp;Lemle and Wolff<BR>
                        Christopher Anelante<BR>
                        Address:&nbsp;5925 Broadway<BR>
                        Address:&nbsp;Bronx, NY 10463<BR>
                        Telephone:&nbsp;718 884-7676&nbsp;&nbsp;Fax:&nbsp;718 884-5300<BR>          
                        Email:&nbsp;<BR>                                    
                    <TD WIDTH="50%" VALIGN="TOP"><B>Billing Address:</B><BR><BR>
                        Company:&nbsp;Lemle and Wolff<BR>
                        Christopher Anelante<BR>
                        Address:&nbsp;5925 Broadway<BR>
                        Address:&nbsp;Bronx, NY 10463<BR>                       
                    </TD>
                </TR>
                <TR>
                    <TD WIDTH="50%"><b>JOB SITE:</b></TD>
                    <TD WIDTH="50%">&nbsp;</TD>
                </TR>
                <TR>
                    <TD VALIGN="TOP" COLSPAN="2">
                        <b>JOB INFORMATION:</b><BR>
                        2651 Eighth Avenue<br>
                        New York, NY 10030<br>
                        Primary Contact: Eriberto Jacques 172*44*29419  Phone: 718 884-7676   Cell:  Beeper:<br>
                        Notes:<BR>
                        JOB TYPE: Pest Control Services<BR>
                        <BR>
<BR>
&nbsp;</TD>
                </TR>
                <TR>
                    <TD COLSPAN="2"><B>Job Description:</B>
                    Pest Control Services-First Friday of the month 12:00 PM
                    </TD>
                </TR>
                <TR>
                    <TD VALIGN="TOP" COLSPAN="2"><B>Special Instructions:</B><BR>
                        Service to all of 10 apartments in building thorough treatment for mice roaches and insects. MUST LIST ALL APARTMENTS IN BUILDING ON LIST. TREAT all common areas and basements and common areas. MUST SEE SUPER FOR ACCESS</TD>
                </TR>
                <TR>
                    <TD COLSPAN="2"><b>ORDER TOTALS</b></TD>
                </TR>               
                <TR>
                    <TD COLSPAN="2">Service Price:&nbsp;$30.00 &nbsp;&nbsp;&nbsp; Parts:&nbsp;$0.00 &nbsp;&nbsp;&nbsp; Subtotal:&nbsp;$30.00 &nbsp;&nbsp;&nbsp; Tax:&nbsp;$2.51 &nbsp;&nbsp;&nbsp; Total:&nbsp;$32.51</TD>
                </TR>                               

                <TR>
                    <TD VALIGN="TOP" COLSPAN="2"><B>Parts:</B><BR>
                    <table width="90%" border="1" cellspacing="0" cellpadding="0"><tr>
                            <TR>
                                <TD WIDTH="49%"><b>ItemID</b></TD>
                                <TD WIDTH="24%"><b>Description</b></TD>
                                <TD WIDTH="20%"><b>Qty</b></TD>
                                <TD WIDTH="20%"><b>Price</b></TD>
                                <TD WIDTH="20%"><b>Total</b></TD>
                            </TR>                           



                        </TD>
                    </tr>   
                    </table>
                </TR>                               
                <TR>
                    <TD COLSPAN="2">&nbsp;</TD>
                </TR>
                <TR>
                    <TD WIDTH="50%" VALIGN="TOP">
                        <DIV>
                            <P><FONT SIZE="2">Please sign that job was completed and performed in a <BR>
                            satisfactory manner.</FONT></P>

                            <P><FONT SIZE="2">Name:___________________________<BR><br>
                            Authorized Signature:_____________________________<BR><br>
                            Title:__________ Date:__________<BR><br>
                            </FONT>
                        </DIV>
                        <P><FONT SIZE="2">Job Completed:&nbsp;&nbsp;[ ]Yes [ ]No </FONT><FONT SIZE="1"></FONT>
                    </TD>
                    <TD WIDTH="50%" VALIGN="TOP"><FONT SIZE="2">Persons on the Job<BR><BR>

                        <TABLE BORDER="1" CELLPADDING="0" CELLSPACING="0" WIDTH="74%">
                            <TR>
                                <TD WIDTH="49%"><FONT SIZE="2"><b>Name</b></FONT></TD>
                                <TD WIDTH="24%"><FONT SIZE="2"><b>Start Time</b></FONT></TD>
                                <TD WIDTH="20%"><FONT SIZE="2"><b>End Time</b></FONT></TD>
                            </TR>



                            <TR>
                                <TD WIDTH="49%">Carlos Almonte</TD>
                                <TD WIDTH="24%">&nbsp;</TD>
                                <TD WIDTH="20%">&nbsp;</TD>
                            </TR>                           


                        </TABLE>
<font size="-1"><br>Please use the back of this workorder for comments.</font></FONT></TD>
                </TR>
            </TABLE>
        </TD>
    </TR>
</TABLE>


</BODY>

</HTML>
<!---<p style="page-break-after: always"></p>--->

    <table Align="Center" width="85%">
        <tr>
            <td valign="Top">
    <font size="+4"><div align="center"><b><u>WARNING!!</u></b></div></font>
    <div align="center"><font size="+3">To all residents of:</font></div><br>
    <font size="+3"><div align="center">2651 Eighth Avenue</div></font>
    <br>
    <div align="center"><font size="+4">Your stairhalls will be cleaned on:</font></div></font>
<br><br>
    <font size="+3"><div align="center">Friday Oct-07/2011 12:00PM-06:11PM</div></font>
<br><br>
    <font size="+4">
    <b>DANGER TO ANYONE ATTEMPTING TO ENTER STAIRWAY !!!!</b>
    <BR><BR>
    <b>MUST USE CAUTION WHEN USING THESE STAIRCASES FOR THE NEXT 48 HOURS!</b>
    </font>
    <br><br>
    <font size="+3"><p align="right">Thank You for your cooperation,<br>
    The Management</p></font>   
            </td>
        </tr>
    </table>    


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<!--last modified on Tuesday, June 05, 2001 08:49 AM -->
<HTML>

<HEAD>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">
    <META NAME="GENERATOR" Content="Visual Page 2.0 for Windows">
    <META NAME="Author" Content="NetCorrespondence.com">
    <TITLE>Confirmation</TITLE>
</HEAD>

<BODY>

<P>
<TABLE BORDER="2" CELLPADDING="0" CELLSPACING="0" WIDTH="100%" HEIGHT="100%">
    <TR>
        <TD WIDTH="100%" VALIGN="TOP">
            <TABLE BORDER="1" WIDTH="100%">
                <TR>
                    <TD WIDTH="50%">&nbsp;
                    </TD>
                    <TD WIDTH="50%">
                        <P ALIGN="RIGHT"><font size="+1"><b>CONFIRMATION OF SERVICES<BR> for Pest Control Services</b></font>
                    </TD>
                </TR>
                <TR>
                    <TD WIDTH="50%" VALIGN="TOP">

                        <table>
                            <tr>
                                <td align="left" valign="Top">&nbsp;

                                </td>
                                <td valign="top">
                        <FONT SIZE="5">Pest Pro Services</FONT><BR>
                        32 Drysdale Street<BR>
                        Staten Island NY 10314<BR>
                        Tel:718 983-0004<BR>
                        Fax:718-477-0333
                        <BR>                    
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">Sales Representative: Debbie</td>
                            </tr>
                        </table>
                    </TD>
                    <TD WIDTH="50%" VALIGN="TOP">
                        <DIV ALIGN="RIGHT">
                        <P>
                        <TABLE BORDER="1" CELLPADDING="0" CELLSPACING="0" WIDTH="75%">
                            <TR>
                                <TD>Order#:</TD>
                                <TD>&nbsp;92681</TD>
                            </TR>
                            <TR>
                                <TD>JobDate:</TD>
                                <TD>&nbsp;10/07/2011</TD>
                            </TR>
                            <TR>
                                <TD>Location:</TD>
                                <TD>&nbsp;Manhattan</TD>
                            </TR>
                            <TR>
                                <TD>StartTime:</TD>
                                <TD>&nbsp;12:00 PM</TD>
                            </TR>
                        </TABLE>

</DIV>
                    </TD>
                </TR>
                <TR>
                    <TD WIDTH="50%">&nbsp;</TD>
                    <TD WIDTH="50%">&nbsp;</TD>
                </TR>
                <TR>
                    <TD WIDTH="50%" VALIGN="TOP">Lemle and Wolff<BR>
                        Telephone:&nbsp;718 884-7676&nbsp;&nbsp;Fax:&nbsp;718 884-5300<BR>
                        Billing Address:&nbsp;5925 Broadway<br>
                        Address:&nbsp;Bronx, NY 10463<BR>
</TD>

                    <TD WIDTH="50%">&nbsp;</TD>
                </TR>
                <TR>
                    <TD WIDTH="50%">&nbsp;</TD>
                    <TD WIDTH="50%">&nbsp;</TD>
                </TR>
                <TR>
                    <TD VALIGN="TOP" COLSPAN="2">
                        JOB TYPE:&nbsp;Pest Control Services<BR>
                        Attention:&nbsp;Eriberto Jacques 172*44*29419<BR>
                        Job Address:&nbsp;2651 Eighth Avenue<BR>
                        Job City:&nbsp;New York
                        Borough or Town:&nbsp;Manhattan<BR>
                        <BR>
                        Site Manager/Super:&nbsp;Eriberto Jacques 172*44*29419&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Tel:&nbsp;718 884-7676
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Beeper:&nbsp; Cell:&nbsp; Location
                        of Site/Mtc:&nbsp;Eriberto Jacques 172*44*29419<BR>
<BR>
&nbsp;</TD>
                </TR>
                <TR>
                    <TD WIDTH="50%">&nbsp;</TD>
                    <TD WIDTH="50%">&nbsp;</TD>
                </TR>
                <TR>
                    <TD WIDTH="50%" VALIGN="TOP"><BR>
                        Dear Customer,<br><br>

                        Thankyou for choosing us as your building maintenance company. Your building/s will be serviced on:<br>

                        <br>
                        <font size="+1"><b>Day:</b>&nbsp;Friday<br>
                        <b>Date:</b>&nbsp;Oct-072011<br>
                        <b>Start Time:</b>&nbsp;12:00 PM<br></font>
                        <br>
                         Please post 
                        any notices if applicable.                                              
                        </TD>
                    <TD WIDTH="50%" VALIGN="TOP">
                    <B><FONT SIZE="2">SPECIAL INSTRUCTIONS:</FONT></B>
                    <br>
                    Service to all of 10 apartments in building thorough treatment for mice roaches and insects. MUST LIST ALL APARTMENTS IN BUILDING ON LIST. TREAT all common areas and basements and common areas. MUST SEE SUPER FOR ACCESS

                    <br>
                    <br>


                    <br>
                                            <TABLE BORDER="1" CELLSPACING="1" WIDTH="80%">
                            <TR>
                                    <TD WIDTH="67%"><FONT SIZE="2">Agreed Price:</FONT></TD>
                                    <TD WIDTH="33%" Align="Right"><FONT SIZE="2">$30.00</FONT></TD>
                            </TR>

                            <TR>
                                <TD WIDTH="67%"><FONT SIZE="2">P.O. #:</FONT></TD>
                                <TD WIDTH="33%"></TD>
                            </TR>
                        </TABLE>
                        <br><br>
<b>                     All cancellations require at least 24 hours of notice to us
                        Failure to do so could result in extra charges.</b>


                    </TD>
                </TR>
                <TR>
                    <TD COLSPAN="2">
                    </TD>
                </TR>
                <TR>
                    <TD VALIGN="TOP">
                    Date Confirmed:&nbsp;<br>
                    Confirmed By:
                    </TD>
                </TR>
            </TABLE>
        </TD>
    </TR>
</TABLE>


</BODY>

</HTML>

<!---<p style="page-break-after: always"></p>--->

1 个答案:

答案 0 :(得分:1)

首先,为您的打印布局制作样式表:

<link rel="stylesheet" href="/css/print.css" type="text/css" media="print" />

键有media="print"

接下来,重置基本样式,使其跨浏览器标准化。查看YUI3的CSS重置语法,以获得快速参考:http://yuilibrary.com/yui/docs/cssreset/

从那里,你会想要省略人们讨厌打印的视觉内容,例如徽标,图形导航等:

#logo, .nav-tab, .etc { 
    display:none;
}

最后,设置分页符,这样就不会在多个页面上进行无意的内容分割:

#some-important-element {
    page-break-before: always;
}

设置完成后,您不必担心跨浏览器的怪癖会干扰您的网页打印效果图。