Latest web development tutorials

fillText tela HTML () Método

HTML Manual de lona Referência HTML Manual de lona Referência

Exemplos

Use fillText (), escreva no texto da lona "Olá, mundo!" E "Big sorriso!":

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);

tente »

Suporte a navegadores

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, Firefox, Opera, Chrome e Safari apoio fillText () método.

Nota: 8 e versões anteriores do Internet Explorer não suportam o elemento <canvas>.

Nota: Safari não suporta parâmetros maxWidth.


Definição e Uso

fillText () para desenhar texto preencher na tela. A cor do texto padrão é preto.

Dica: Use fonte atributos para definir o tamanho da fonte e da fonte e usar fillStyle propriedade para outra cor / gradiente para processar texto.

sintaxe JavaScript: contexto .fillText (texto, X, Y, maxWidth);

parâmetro Valor

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


HTML Manual de lona Referência HTML Manual de lona Referência