怎样去照片水印文字

使用CSS实现照片水印文字

我们可以使用CSS的position属性和伪元素before来实现照片水印文字的效果。

	    .watermark {
	        position: relative;
	    }
	    .watermark:before {
	        content: "水印文字";
	        color: rgba(0,0,0,0.5);
	        font-size: 3em;
	        font-weight: bold;
	        transform: rotate(-30deg);
	        position: absolute;
	        left: -10%;
	        top: 50%;
	    }
	

使用Canvas实现照片水印文字

我们可以使用Canvas对图片进行处理，在上面添加水印文字效果。

	    var canvas=document.createElement("canvas");
	    var ctx=canvas.getContext("2d");
	    var img=new Image();
	    img.onload=function(){
	        canvas.width=img.width;
	        canvas.height=img.height;
	        ctx.drawImage(img,0,0);
	        ctx.font="50px Arial";
	        ctx.fillStyle="white";
	        ctx.fillText("水印文字",canvas.width/2, canvas.height/2);
	        var base64=canvas.toDataURL();
	        var img=new Image();
	        img.src=base64;
	        document.body.appendChild(img);
	    };
	    img.src="image.jpg";
	

使用PHP实现照片水印文字

我们可以使用PHP的GD库对图片进行处理，在上面添加水印文字效果。

	    $image=imagecreatefromjpeg("image.jpg");
	    $color=imagecolorallocatealpha($image, 255, 255, 255, 80);
	    $fontfile="arial.ttf";
	    $fontsize=50;
	    $text="水印文字";
	    $angle=30;
	    $bbox=imagettfbbox($fontsize, $angle, $fontfile, $text);
	    $x=($bbox[2] - $bbox[0]) / 2;
	    $y=($bbox[3] - $bbox[5]) / 2;
	    imagettftext($image, $fontsize, $angle, imagesx($image) / 2 - $x, imagesy($image) / 2 + $y, $color, $fontfile, $text);
	    header("Content-type: image/jpeg");
	    imagejpeg($image);
	    imagedestroy($image);
	

总结

照片水印文字可以使用CSS的position属性和伪元素before、Canvas和PHP的GD库等方法实现。在选择具体实现方法时，可以考虑对浏览器兼容性、图片大小和生成的效果等进行综合考虑。