欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  后端开发

javascript - 如何生成描边的字体并保存成图片,用canvas或php解决?

程序员文章站 2022-05-11 18:52:49
...

描边的大小可以设定
javascript - 如何生成描边的字体并保存成图片,用canvas或php解决?

  1. 目前二维码是后台自动生成的,文字也是自动生成,已经被我用css整合在图片居中的地方

代码结构如下:

javascript - 如何生成描边的字体并保存成图片,用canvas或php解决?我是描边字体

print.css的样式如下:

.font-border{
    text-shadow: 0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff;

}    

样式上最终也是描边效果,但点击了打印以后,描边样式就消失了(谷歌浏览器版本 52.0.2743.60 (64-bit))
是不是打印不支持text-shadow?

2.后来找到了http://www.liantu.com/,发现他们是用canvas实现图片和文字的整合。
但他们做了加密处理,解密了以后,也读不懂,变量都是单个字母。
用canvas可不可以直接将我上面设置好的图片和文字元素和他们的位置包裹起来,然后我点击了下载,直接将图片下载到本地

3.或者可以用什么php的插件来实现描边么?

回复内容:

描边的大小可以设定
javascript - 如何生成描边的字体并保存成图片,用canvas或php解决?

  1. 目前二维码是后台自动生成的,文字也是自动生成,已经被我用css整合在图片居中的地方

代码结构如下:

javascript - 如何生成描边的字体并保存成图片,用canvas或php解决?我是描边字体

print.css的样式如下:

.font-border{
    text-shadow: 0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff,0 0 6px #fff;

}    

样式上最终也是描边效果,但点击了打印以后,描边样式就消失了(谷歌浏览器版本 52.0.2743.60 (64-bit))
是不是打印不支持text-shadow?

2.后来找到了http://www.liantu.com/,发现他们是用canvas实现图片和文字的整合。
但他们做了加密处理,解密了以后,也读不懂,变量都是单个字母。
用canvas可不可以直接将我上面设置好的图片和文字元素和他们的位置包裹起来,然后我点击了下载,直接将图片下载到本地

3.或者可以用什么php的插件来实现描边么?

把图片画到 canvas 上,文字也一样,canvas 支持文字描边。

示例:
https://jsfiddle.net/imys/yjhs8rz4/

php 来生成字体图片,描边字体是跟字体文件有关