Latest web development tutorials

HTML propriété toile textAlign

HTML Manuel toile de référence HTML Manuel toile de référence

Exemples

Créer une ligne rouge à la position 150. Position 150 est définie dans les exemples suivants tout le texte d'ancre. S'il vous plaît étudier l'effet de chacune des valeurs de propriété textAlign:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

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

// Create a red line in position 150
ctx.strokeStyle="red";
ctx.moveTo(150,20);
ctx.lineTo(150,170);
ctx.stroke();

ctx.font="15px Arial";

// Show the different textAlign values
ctx.textAlign="start";
ctx.fillText("textAlign=start",150,60);
ctx.textAlign="end";
ctx.fillText("textAlign=end",150,80);
ctx.textAlign="left";
ctx.fillText("textAlign=left",150,100);
ctx.textAlign="center";
ctx.fillText("textAlign=center",150,120);
ctx.textAlign="right";
ctx.fillText("textAlign=right",150,140);

Essayez »

support du navigateur

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, Firefox, Opera, Chrome et Safari soutien propriété textAlign.

Note: 8 et versions antérieures d'Internet Explorer ne prennent pas en charge l'élément <canvas>.

Définition et utilisation

textAlign attributs comme des ensembles d'ancrage ou retourne le contenu du texte de l'alignement actuel.

En règle générale, le texte àpartir de l'emplacement spécifié, mais si vous définissez le textAlign = "right" et le texte est placé à la position 150, la position 150 à la fin.

Astuce: Utilisez fillText () ou strokeText () méthode pour réellement dessiner et positionner le texte sur la toile.

Par défaut: début
Syntaxe JavaScript: contexte .textAlign = "center | fin |left | right | start";

Valeur de la propriété

值 描述
start 默认。文本在指定的位置开始。
end 文本在指定的位置结束。
center 文本的中心被放置在指定的位置。
left 文本在指定的位置开始。
right 文本在指定的位置结束。

HTML Manuel toile de référence HTML Manuel toile de référence