IE6.0打印机制解析

 网页打字与印刷，不妨经过欣赏器的"打字与印刷"功效实行，但"打字与印刷沙盘"体制，却是 ie 5.5 /6.0 以及 netscape 6.0 所独占的；精确一点， ie 5.5 不过一个体制雏形，在 ie 6.0 中才得以完理想现。ie 6.0 的打字与印刷功效模块，在透彻遏制页面边境，文本间隙，以及打字与印刷的一致性上，功效更为完美。经过创造打字与印刷沙盘，你不妨透彻遏制：网页打字与印刷及预览时的页面作风与实质编排作风；打字与印刷属性，如机动为打字与印刷的页面增添卷标或编号；透彻遏制打字与印刷预览界面包车型的士各个元素与变量。经过打字与印刷沙盘，你不妨：机动为一切打字与印刷页面增添恒定实质，如公司标识，版权声明，大概指定告白；自设置页面标头与尾注等元素，比方页码或卷标；指定打字与印刷汗青与工作；书籍化奇偶分页映照打字与印刷......打字与印刷沙盘体制是创造在动静 html 谈话普通上的，波及到重要两个动作：devicerect, layoutrect ，底下咱们就这两个动作深刻地商量 ie 6.0 的打字与印刷体制。其余须要证明的是，dhtml （动静超文本标识谈话）的动作跟其余谈话的"动作"一律，都是一种运用编制程序接口，初始状况下有本人的默许属性，在确定的事变下，由用户确定挪用其供认的功效模块，进而爆发对立应的"动作"。并且，"动作"不妨本人编写，然而得以".htc"为其扩充名以供挪用。一．devicerect ，设置打字与印刷总体作风：打字与印刷总体作风，囊括为打字与印刷页面增添如公司标识的恒定实质（网页上不确定有，只展现在打字与印刷纸张上或预览页面上，后同）；打字与印刷页面包车型的士脸色作风；打字与印刷页面包车型的士边际属性或图案；之类。在举行 devicerect 援用前，先得决定页面作风，本领是用＜style＞举行树立。例一：咱们来定制如次的打字与印刷沙盘8.5 inch 宽11 inch 高黄色后台1 pixel 宽的玄色实心左边境1 pixel 宽的玄色实心上边境4 pixels 宽的玄色实心右边境4 pixels 宽的玄色实心下边境一切边境与纸张边际为 10 pixels 的隔绝此刻咱们用 style 举行设定，假如这个 style 名为 mystyle1：

＜style type="text/css"＞.mystyle1{width:8.5in;height:11in;background:#ffff99;border-left:1 solid black;border-top:1 solid black;border-right:4 solid black;border-bottom:4 solid black;margin:10px;}＜/style＞

底下咱们给出 devicerect 援用的实足页面代码，＜html xmlns:ie＞＜head＞＜?import namespace="ie" implementation="#default"＞＜style type="text/css"＞.mystyle1{width:8.5in;height:11in;background:#ffff99;border-left:1 solid black;border-top:1 solid black;border-right:4 solid black;border-bottom:4 solid black;margin:10px;}＜/style＞＜/head＞＜body＞＜ie:devicerect id="page1" class="mystyle1" media="print"＞＜/ie:devicerect＞＜ie:devicerect id="page2" class="mystyle1" media="print"＞＜/ie:devicerect＞＜/body＞＜/html＞

在这个页面中，共举行了两个 devicerect 援用。动作一种准则，每一个独立的打字与印刷页面，必需有一个对立应的 devicerect 标志，即使有 1000 个页面，那就得有 1000 个 devicerect 标志！吓住了？别担忧，反面咱们会教你一个本领，让一切的 devicerect 标志机动实行！在上头的代码中，id 是标记属性，各别的页面必需有本人各别的标识；class 援用了 style 属性；media 属性则指领会本页面包车型的士最后用处是举行打字与印刷；＜?import namespace="ie" implementation="#default"＞这句话则是指输出默许的动作，它们辨别是 devicerect, layoutrect。二．layoutrect ，设置页面实质作风：跟 devicerect 一律，各别的页面，要举行 layoutrect 援用时都须要增添 layoutrect 标志，其智能增添本领将在反面引见； layoutrect 与 devicerect 即使在同一个页面中同声展示，则前者需放在后者之内；其余， layoutrect 对实质作风的设定，也经过 style 得以实行。例二：咱们来定制如次的实质作风的打字与印刷沙盘：5.5 inches 宽8 inches 高与打字与印刷纸张边际，四边维持 1 inch 的宽窄（加上页面自己的边际宽窄，为本质的打字与印刷边际宽窄）白色后台1 inch 宽的虚线边境先定制名为 contentstyle 的作风：＜style type="text/css"＞.contentstyle{width:5.5in;height:8in;margin:1in;background:white;border:1 dashed gray;}＜/style＞

而后底下是举行援用的完备网页代码：＜html＞＜head＞＜?import namespace="ie" implementation="#default"＞＜style type="text/css"＞.contentstyle{width:5.5in;height:8in;margin:1in;background:white;border:1 dashed gray;}＜/style＞＜/head＞＜body＞＜ie:layoutrect id="layoutrect1" contentsrc="2.html" class="contentstyle"　nextrect="layoutrect2"/＞＜ie:layoutrect id="layoutrect2" class="contentstyle"/＞＜/body＞＜/html＞

跟例第一中学的源代码比拟，例二中不过以 layoutrect 包办了从来的 devicerect 标志；devicerect 定制的是沙盘完全作风，而 layoutrect 定制的是简直实质的版面作风；layoutrect 的 id 属性也具备独一性； contentsrc 属性则指领会简直的将起效率网页文献；class 指领会作风的援用东西；跟 devicerect 各别，在举行 layoutrect 援用时，必需在每个页面指定 nextrec ，即顺序陈设的下一个实质作风，这边的"下一个实质"用其页面包车型的士相映 id 举行标识，如本例中的 layoutrect2 。三．devicerect 与 layoutrect 的共同兴办：上头咱们辨别计划了 devicerect 与 layoutrect 的效率与援用本领，此刻咱们来看一下，怎样在同一个打字与印刷沙盘中举行定制与援用。在每一个打字与印刷沙盘上，必定包括两上面的实质，一个是完全的沙盘作风（devicerect），另一个是实质作风（layoutrect）；第一个打字与印刷页面跟其余页面是各别的，由于第一个页面中必需指明 contentsrc 属性，而同一打字与印刷工作中的其余页面不复须要举行 contentsrc 的指定。例三：底下是第一个页面中的 devicerect 代码：＜ie:devicerect id="page1" class="masterstyle" media="print"＞＜ie:layoutrect id="layoutrect1" contentsrc="2.html" class="contentstyle" nextrect="layoutrect2"/＞＜/ie:devicerect＞底下是其余页面中的 devicerect 代码：＜ie:devicerect id="page2" class="masterstyle" media="print"＞＜ie:layoutrect id="layoutrect2" class="contentstyle"/＞＜/ie:devicerect＞

底下咱们将 devicerect 与 layoutrect 贯串起来运用，其源代码如次：＜html xmlns:ie＞＜head＞＜?import namespace="ie" implementation="#default"＞＜style type="text/css"＞.contentstyle{width:5.5in;height:8in;margin:1in;background:white;border:1 dashed gray;}.mystyle1{width:8.5in;height:11in;background:#ffff99;border-left:1 solid black;border-top:1 solid black;border-right:4 solid black;border-bottom:4 solid black;margin:10px;}＜/style＞＜/head＞＜body＞＜ie:devicerect id="page1" class="mystyle1" media="print"＞＜ie:layoutrect id="layoutrect1" contentsrc="2.html" class="contentstyle" nextrect="layoutrect2"/＞＜/ie:devicerect＞＜ie:devicerect id="page2" class="mystyle1" media="print"＞＜ie:layoutrect id="layoutrect2" class="contentstyle"/＞＜/ie:devicerect＞＜/body＞＜/html＞

四．devicerect 与 layoutrect 标志的动静机动增添：前方咱们说到，每个独立的打字与印刷页面都须要各自的 devicerect 与 layoutrect 标志，那么，即使咱们有 1000 个页面须要打字与印刷，能否就要在每个页面上反复烦琐的 copy & paste 操纵？谜底能否定的，咱们实足不妨经过 javascript 脚从来实行这一烦琐的处事。要实行 html 证明的动静创造，要害在乎 ＜div＞ 标志的设置，底下是其设置准则。＜div id="devicecontainer"＞......＜/div＞＜div＞与＜/div＞之间，沿用 insertadjacenthtml() 办法，并重要运用了其 afterbegin 与 beforeend 两个变量，此刻咱们将第一个页面"插入"到＜div＞＜/div＞之间：devicecontainer.insertadjacenthtml("afterbegin", newhtml);具备接受属性的后续页面，挪用 beforeend 变量：devicecontainer.insertadjacenthtml("beforeend", newhtml);要承载 devicecontainer 页面，还需在 ＜body＞中增添：＜body onload="addfirstpage()"＞此刻咱们在 javascript 中增添包括前方精细引见的 layoutrect 与 devicerect 元素，用到的吩咐是 addfirstpage() 。须要提防的是，newhtml 标志后运用的是双引号，而 layoutrect 与 devicerect 标志后的变量运用单引号。如次：function addfirstpage() {newhtml = "＜ie:devicerect id='devicerect1' media='print' class='mystyle1'＞";newhtml += "＜ie:layoutrect id='layoutrect1' contentsrc='2.html'" + "onlayoutcomplete='onpagecomplete()' nextrect='layoutrect2'" + "class='contentstyle'/＞";newhtml += "＜/ie:devicerect＞";devicecontainer.insertadjacenthtml("afterbegin", newhtml);}

经心的读者群确定会创造，layoutrect 后展示了一个新的属性：layoutrect:onlayoutcomplete ，这个属性重要指定了 layoutrect 遏止相应的后续事变，如体例资源耗费殆尽而遏止相应，大概 layoutrect 指定的变量溢出。好了，有了上头的道理，底下咱们来编写具备机动"插入"功效的 javascript 代码：function onpagecomplete() {if (event.contentoverflow) {newhtml = "＜ie:devicerect id='devicerect" + (lastpage + 1) + "' media='print' class='mystyle1'＞";newhtml += "＜ie:layoutrect id='layoutrect" + (lastpage + 1) + "' onlayoutcomplete='onpagecomplete()' nextrect='layoutrect" + (lastpage + 2) + "' class='contentstyle'/＞";newhtml += "＜/ie:devicerect＞";devicecontainer.insertadjacenthtml("beforeend", newhtml);lastpage++;}

在上头的代码中，contentoverflow 代办的是因为页面消息过长，本页的 layoutrect 遏止相应，则径直跳到下一个页面，让 layoutrect 从新设置下一个页面包车型的士版面；onpagecomplete() 则尽管页面能否过长，layoutrect 能否遏止相应，只有到了页面尾部则机动跳到下一页，这也是最罕见的情景。