如何在h5网页添加水印

html-css07

如何在h5网页添加水印,第1张

Canvas简介及实践： canvas是HTML5新增的元素，主要作用是支持用JS画图。 一、创建Canvas元素 二、通过JavaScript来绘制 canvas 元素本身是没有绘图能力的。所有的绘制工作必须在 JavaScript 内部完成。•1:JavaScript使用id来寻找canvas元素。 •2:创建context对象。getContext(“2d”)对象是内建的HTML5对象。 3:绘制一个红色的矩形。fillStyle方法将其染成红色，fillRect方法规定了形状、位置和尺寸 三、实例-图像 把一幅图像放置到画布上：四、水印生成主流程 1、建立一个画布： 2、生成水印字符串： 3、CanvasElement.toDataURL() 方法返回一个包含图片展示的data URLs，包含了Base64过的图像信息。说明：Data URLs, URLs prefixed with the data: scheme, allow content creators to embed small files inline in documents. 例如：“data:image/pngbase64,R0lGODdhMAAwAPAAAAAAAP” 4、平铺在background上

1. 打开软件，点击左上角的“添加文件”按键，选择好需要去水印的视频。

2.

在视频打开后，工具栏里分别有“选择”、“笔”、“查找徽标”三个按键。这代表了三种去水印的方法。使用“选择”的话，就跟我们使用屏幕截图

一样，在有水印出现的地方用鼠标拉出一个框，把这个水印遮掩住就行了。使用“笔”的话，就想用系统的画板，直接用笔在水印位置上涂抹。使用“查找徽标”是

软件自动计算水印位置进行遮掩。（通常不建议使用这项，很多时候水印都不会遮掩的很干净的。）