php 画布背景颜色,如何保存画布为渐变背景php/html5？

在html2canvas'自述的浏览器的兼容性部分，你可以阅读：

由于每个CSS属性需要手动建立得到支持，有 是还不支持很多属性。

background-image的梯度是那些。

你只需要自己编写它，或者等到有人为html2canvas库做了。

如果你已经有了一个固定的梯度来渲染，它很容易使其canvas元素上第一，这画布dataURI版本设置为你的CSS的背景图像。

var renderGradients = function(elem){

// get the size of your element

var rect = elem.getBoundingClientRect();

// create a canvas and set it to the same size as the element

var canvas = document.createElement('canvas');

canvas.width = rect.width;

canvas.height = rect.height;

var ctx = canvas.getContext('2d');

// create a new gradient, the size of our element

var gradient = ctx.createLinearGradient(0,0,rect.width,rect.height);

// add the colors we have in our style

gradient.addColorStop(0, 'blue');

gradient.addColorStop(1, 'red');

ctx.fillStyle = gradient;

// draw a rect with our gradient

ctx.fillRect(0, 0, rect.width, rect.height);

// set our element's background-image to the canvas computed gradient

elem.style.backgroundImage = 'url('+canvas.toDataURL()+')';

// now call html2canvas

html2canvas(elem, {onrendered : function(can){

document.body.appendChild(can);

}});

}

renderGradients(cont);

#cont {background-image: linear-gradient(90deg, blue, red);}

Some content

html2canvas result :

但考虑到的CSS的复杂性梯度语法，这是更难做的东西，将一个已经存在的CSS背景图像梯度转换成画布版本。 如果有人想这样做，我很乐意阅读它。所以你将不得不坚持硬编码梯度值。