之前的博文：LODOP中平铺图片 文本项Repeat、 该博文中是平铺的图片，上面是文本。
如果是图片add_print_image和add_print_text纯文本，这两个打印项设计的，可以直接通过打印项的层级关系，图片在下层，文字在上层，对文字后面进行背景平铺。关于层级，可查看本博客另一篇相关博文：Lodop调整打印项输出顺序 覆盖与层级、

上面的第一个链接博文，中是用图片作为底图进行平铺，上面是add_print_text纯文本，由于lodop中的纯文本本身就是无背景色的，所以可以看到下方的背景图。
如果是超文本，除了要注意层级关系，还有注意去掉超文本本身的背景色，让超文本变透明，才能透过超文本看到底下的水印，css样式里有个设置背景色为transparent透明，可以加上这个。如果超文本本身自带背景色，那么需要去掉超文本本身的背景色。

如果不想去掉超文本的背景色，想在超文本背景色和超文本内容文字之间加上水印，让水印在背景色上面，文字下面，是不行的，因为平铺的图片和超文本是两个打印项，不可能将水印放到图片和背景色之间。
如果位置固定，或者直接用合成图，把水印和背景合成起来做成一张适合纸张的大图，目前没有发现其他的很好的处理方法。关于合成一个大图背景，可查看本博客另一篇博文的图示，或者把水印加在文字上方，但是水印部分会遮挡文字，目前发布的正式版没有加透明度的功能。

测试代码：

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>WEB打印控件LODOP</title>

<script language="javascript" src="LodopFuncs.js"></script>

<style>#p{background-color:#bbf1f2;padding:20mm;width:60mm;height:60mm;</style>

</head>

<body>

<div id="printN">

<div id="p">

官网样例是混合部署LodopFuncs.js里已经写好了判断。

客户端是浏览器支持np插件，是32位浏览器，就会提示下载32位的Lodop插件：install_lodop32.exe

客户端浏览器支持np插件，是64位浏览器，就会提示下载64位的Lodop插件：install_lodop64.exe

客户端浏览器不支持np插件（判断如高版本谷歌火狐等），会提示下载C-Lodop方式： CLodop_Setup_for_Win32NT.exe

</div>

</div>

<a href="javascript:prn1_preview()">打印预览（超文本不透明，有背景色）</a><br>

<a href="javascript:prn2_preview()">打印预览（超文本透明，可以看到底层的水印图片）</a>

<script language="javascript" type="text/javascript">

        var LODOP; //声明为全局变量

    function prn1_preview() {

        LODOP=getLodop();

        LODOP.PRINT_INIT("");

        LODOP.ADD_PRINT_IMAGE(0,0,"100mm","100mm","<img src='./sy.png'>");

        LODOP.SET_PRINT_STYLEA(0,"Repeat",true);

        var styleN="<style>#p{background-color:#bbf1f2;padding:20mm;width:60mm;height:60mm;</style>";

        LODOP.ADD_PRINT_HTM(0,0,"100%","100%",styleN+document.getElementById("printN").innerHTML);

        LODOP.PRINT_DESIGN();

        //LODOP.PREVIEW();

    };

    function prn2_preview() {

        LODOP=getLodop();

        LODOP.PRINT_INIT("");

        LODOP.ADD_PRINT_IMAGE(0,0,"100mm","100mm","<img src='sy.png'>");

        LODOP.SET_PRINT_STYLEA(0,"Repeat",true);

        var styleN="<style>#p{padding:20mm;width:60mm;height:60mm;</style>";

        //var styleN2="<style>#p{background-color:transparent;padding:20mm;width:60mm;height:60mm;</style>";

        //或加css样式，background-color:transparent;，背景色透明

        LODOP.ADD_PRINT_HTM(0,0,"100%","100%",styleN+document.getElementById("printN").innerHTML);

        LODOP.PREVIEW();

    };

</script>

</body>

图示：

LODOP中设置设置图片平铺水印，超文本透明的更多相关文章

  1. Android设置背景图片平铺

    以LinearLayout为例,它提供的background属性将会将背景图片拉伸,相当难看.其实我们仅仅需做少量的改动就能够实现web编程中css背景图片的效果.来试试吧. 创建反复的背景图片 在d ...

  2. Android中设定背景图片平铺。

    注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 在做Android开发时,我们常常需要为程序设定一个背景,但由于现在的Android设备尺寸不一,如果随便设置一个图片为背景,那么很 ...

  3. LODOP打印超文本保留背景色带平铺水印

    前面的博文:LODOP中设置设置图片平铺水印,超文本透明. 介绍过 ,如果不想去掉超文本的背景色,想在超文本背景色和超文本内容文字之间加上水印,让水印在背景色上面,文字下面,是不行的,因为平铺的图片和 ...

  4. Canvas 图片平铺设置

    /** * 图片平铺 */ function initDemo7(){ var canvas = document.getElementById("demo7"); if (!ca ...

  5. Java 在Excel中添加水印（单一水印、平铺水印）

    在Excel中没有直接添加水印的功能,但依旧可以通过一定方式来实现类似水印效果.本文通过Java程序代码介绍具体实现方法.可添加单一水印效果,即水印是以单个文本字样来呈现:也可添加多个平铺水印效果,即 ...

  6. php 给图片增加背景平铺水印代码

    如果你想利用php 给图片增加背景平铺水印效果话,必须利用php的一个插件来实例,就是利用imagick,他可以给图片增加背景平铺水印效果哦,下面我们提供一款实例代码. 如果你想利用php教程 给图片 ...

  7. Duilib技巧：背景图片平铺

    贴图的描述 方式有两种    // 1.aaa.jpg    // 2.file='aaa.jpg' res='' restype='0' dest='0,0,0,0' source='0,0,0,0 ...

  8. [UWP]通过自定义XamlCompositionBrushBase实现图片平铺

    1. 什么是XamlCompositionBrushBase 我早就想试试自定义XamlCompositionBrushBase,但一直没机会.上一篇文章介绍到使用Win2D的BorderEffect ...

  9. canvas实现平铺水印

    欲实现的水印平铺的效果图如下: 从图上看,应该做到以下几点: 文字在X和Y方向上进行平铺: 文字进行了一定的角度的旋转: 水印作为背景,其z-index位置应位于页面内容底部, 即不能覆盖页面主内容: ...

随机推荐

  1. 四大网络之Alexnet

       本文主要介绍AlextNet的一些知识,这些知识经常被忽略 一.AlextNet的创新点 (1)成功使用ReLU作为CNN的激活函数,并验证其效果在较深的网络超过了Sigmoid,成功解决了Si ...

  2. 020_Python3 File(文件) 方法

    1.open() 方法 Python open() 方法用于打开一个文件,并返回文件对象,在对文件进行处理过程都需要使用到这个函数,如果该文件无法被打开,会抛出 OSError. 注意:使用 open ...

  3. Vim初学

    实现G++编译 1,首先下载安装MinGW,下载地址在http://sourceforge.net/projects/mingw/.这个是边下载边安装的,下载完成即安装完成.我的安装目录是G:\Min ...

  4. TCP协议怎么工作的？

    三次握手过程: 第一次 第一次握手:建立连接时,客户端发送syn包(syn=j)到服务器,并进入SYN_SENT状态,等待服务器确认:SYN:同步序列编号(Synchronize Sequence N ...

  5. Leetcode44. 通配符匹配(动态规划)

    44. 通配符匹配 动态规划 \(f_{i,j}\)为\(s\)匹配\(i\),\(t\)匹配\(j\)是否成功 贪心 相比之下这个思维性更强 考虑两个*,两个星号间的过渡,只需要过渡完到第二个星号, ...

  6. linux设置定时任务的方法步骤

    一,首先登录 二,找到文件夹 三,查看定时任务 crontab -l 四,vi root 编辑定时任务 编辑完成后,点ESC,然后:wq 时间格式 分钟 小时 日期 月份 周 命令 数字范围 0-59 ...

  7. 根据数据文件自定义边界条件timeVaryingUniformFixedValue【转载】

    转载自:http://blog.sina.com.cn/s/blog_e256415d0101nf9j.html 在OpenFOAM中,可以创建数据文件,自定义边界条件. 下面的例子读取outletP ...

  8. 大数据|linux权限chmod和chown

    一.基础概念 1)rwx含义 示例如下 r:读权限read 4 w:写权限write 2 x:操作权限execute  1 -:无权限 2)drwxr - xr -x 与 - rw - r - - r ...

  9. python操作toml文件

    # -*- coding: utf-8 -*- # @Time : 2019-11-18 09:31 # @Author : cxa # @File : toml_demo.py # @Softwar ...

  10. 2018-2019 20165226 Exp 8 Web基础

    2018-2019 20165226 Exp 8 Web基础 目录 一.实验内容说明及基础问题回答 二.实验过程 1.Web前端:HTML 2.Web前端j:avascipt 3.Web后端:MySQ ...