Latest web development tutorials

fillText lienzo HTML método ()

HTML Manual de Referencia de la lona HTML Manual de Referencia de la lona

Ejemplos

Utilice fillText (), escriba en el texto de la lona "¡Hola mundo!" Y "Big sonrisa!":

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

ctx.font="20px Georgia";
ctx.fillText("Hello World!",10,50);

ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.fillStyle=gradient;
ctx.fillText("Big smile!",10,90);

Trate »

Soporte para el navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, el método de Firefox, Opera, Chrome y Safari fillText apoyo ().

Nota: 8 y versiones anteriores de Internet Explorer no son compatibles con el elemento <canvas>.

Nota: Safari no admite parámetros anchoMax.


Definición y Uso

fillText método () para dibujar el texto de relleno en el lienzo. El color del texto por defecto es negro.

Consejo: Utilice la fuente atributos para definir el tamaño de la fuente y la fuente, y el uso de fillStyle propiedad a otro color / degradado para representar el texto.

la sintaxis de JavaScript: contexto .fillText (texto, x, y, anchoMax);

parámetro Valor

参数 描述
text 规定在画布上输出的文本。
x 开始绘制文本的 x 坐标位置(相对于画布)。
y 开始绘制文本的 y 坐标位置(相对于画布)。
maxWidth 可选。允许的最大文本宽度,以像素计。


HTML Manual de Referencia de la lona HTML Manual de Referencia de la lona