很多朋友在套打时经常出现页面上的对象无法对齐的情况,这里我们谈论几个小技巧,来使我们的套打操作更方便。

学C30网G3f页92Q网(http://www.xwangye.com)

1。长度单位的选择

学C30网G3f页92Q网(http://www.xwangye.com)

我们知道,平时做网页时最常用的长度单位就是像素(px),但是实际中我们无法量出票据上的数据的像素数,我们能量出的只是长度单位cm或mm.

学C30网G3f页92Q网(http://www.xwangye.com)

其实,在网页中设置对象的宽度还可以使用mm作为单位,只是因为我们在设计网页时不经常使用,所以我们在制作打印模板网页时会想不起这个单位。只要我们利用好这个单位,实现我们的操作是没有问题的。

学C30网G3f页92Q网(http://www.xwangye.com)

2。元素的定位操作

学C30网G3f页92Q网(http://www.xwangye.com)

在网页中,我们可以使用positon属性来定位,这对于我们制作套打页面时是非常有利。比如,我定义一个我要把“墙外打印控件套打测试”这几个字显示到距上边20mm,左侧15mm,我可以这样定义一个span对象的样式:

学C30网G3f页92Q网(http://www.xwangye.com)

以下是代码片段:
<body style="margin:0px;padding:0px;">
<span style="posistion:absolute;top:20mm;left:15mm;">墙外打印控件套打测试</span>
</body>

学C30网G3f页92Q网(http://www.xwangye.com)

注意:上述在设置打印控件的属性PrintActiveX.padding="0"时,才有效,否则,该span会定位在(页面上边距+20mm的位置)和(页面左边路+15mm的位置)。因为网页中的定位是相对于Body来的,而实际打印时是相对于内容页面区域。

学C30网G3f页92Q网(http://www.xwangye.com)

 

学C30网G3f页92Q网(http://www.xwangye.com)

补充:

学C30网G3f页92Q网(http://www.xwangye.com)

3。多页定位

学C30网G3f页92Q网(http://www.xwangye.com)

一个朋友来信说,上面的定位方式对于一页来说定位是很方便的,但是如果打印的内容有两页或更多页时,则除第一页(打印页)外的页上的元素则不是那么好定位。那么对于多页时,我们如何定位呢?

学C30网G3f页92Q网(http://www.xwangye.com)

首先我们写一段测试打印页代码。

学C30网G3f页92Q网(http://www.xwangye.com)

以下是代码片段:
<body style="margin:0px;padding:0px;">
//放置两个div
<div style="position:absolute;left:50mm;top:10mm;height:5mm;width:50mm;border:1px solid #00ff00;">墙外打印控件套打测试一</div>
<div style="position:absolute;left:50mm;top:71mm;height:5mm;width:50mm;border:1px solid #00ff00;">墙外打印控件套打测试二</div>
<script type="text/javascript">
PrintActiveX.padding="200 120 0";
PrintActiveX.margin="0";
PrintActiveX.footer="";
PrintActiveX.header="";
PrintActiveX.pageWidth=2040;
PrintActiveX.pageHeight=810;
PrintActiveX.orientation=1;
PrintActiveX.PrintView();
</script>
</body>

学C30网G3f页92Q网(http://www.xwangye.com)

测试目标:实现代码中的两个div在各自页中的同一高度,并且离内容页面顶(注意是内容页面顶,不是纸张顶)10mm。内容页面,即打印预览中那四个边距游标包围的矩形的区域。

学C30网G3f页92Q网(http://www.xwangye.com)

对于上面代码中的两个div,要实现该测试目标,其实只要定义好他们style中的top即可。第一个div的top的值非常好求,直接就是10mm。关键是第二个div的top值要设置为多少呢?

学C30网G3f页92Q网(http://www.xwangye.com)

通过打印预览界面,我们可以看到,两个div的高度差应等于一个内容页面的高。所以,我们只要能计算出内容页面的高度,那个第二个div的top值就好设置啦。

学C30网G3f页92Q网(http://www.xwangye.com)

那内容页面的高度如何计算呢?

学C30网G3f页92Q网(http://www.xwangye.com)

我们已经知道整个页的高度是81mm,上下边距的和是20mm,所以内容页面的高度是81-20=61mm。于是第二个div的top应为71mm。

学C30网G3f页92Q网(http://www.xwangye.com)

 

学C30网G3f页92Q网(http://www.xwangye.com)

扩展:

学C30网G3f页92Q网(http://www.xwangye.com)

上面的情况,我是考虑的最简单的情况,排除了打印机的不可打印区域的影响,和页眉页脚的影响。如果实际测试可能会有误差。

学C30网G3f页92Q网(http://www.xwangye.com)

实际的情况,应该是,在(不可打印区域+页眉页脚)和页边距这两个值中找出一个大的作为页面高度要减去的值来计算内容页面的高度。

学C30网G3f页92Q网(http://www.xwangye.com)

不可打印区域一般与打印机有关,大家可以查一下,然后再计算与设计页面。

学C30网G3f页92Q网(http://www.xwangye.com)

也可以通过打印预览看一下实际的上边距和下边距,然后用纸张高度减去上下边距之和,即为内容页面的高度。注意:这里的上下边距是打印预览中显示的实际高度,而不一定等于你手动设置的上下边距。

学C30网G3f页92Q网(http://www.xwangye.com)

另外,关于不可打印区域的问题,可以看我转发的文章《也谈WPS2000打印预览的问题》。

学C30网G3f页92Q网(http://www.xwangye.com)

 

学C30网G3f页92Q网(http://www.xwangye.com)

以上写的可能很乱,对不起各位啦。最近比较忙,有时间我再重新整理一下,大家先凑和着看吧。

学C30网G3f页92Q网(http://www.xwangye.com)