Canvas textAlign özelliği
Tanım ve Kullanım
textAlign Özellik, bağlantı noktasına göre metin içeriğinin mevcut hiza biçimini ayarlar veya döndürür.
Genellikle, metin belirlenen konumdan başlar, ancak textAlign="right" olarak ayarlanmışsa ve metin 150 konumuna konulmuşsa, metin 150 konumunda sona erer.
İpucu：ile kullanılır fillText() veya strokeText() metni gerçekten çizip konumlandırır.
örnek
150 konumunda kırmızı bir çizgi oluşturur. 150, aşağıdaki örnekte tanımlanan tüm metinlerin bağlantı noktasıdır. Her çeşit textAlign özellik değerinin etkilerini inceleyin:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
// 150 konumunda mavi çizgi oluşturur
ctx.strokeStyle="mavi";
ctx.moveTo(150,20);
ctx.lineTo(150,170);
ctx.stroke();
ctx.font="15px Arial";
// farklı textAlign değerlerini gösterir
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);
gramer
context.textAlign="center|end|left|right|start";
özellik değeri
| değer | tanım |
|---|---|
| start | 默认。Metin belirlenen konumda başlar. |
| son | metin belirlenen konumda sona erer. |
| merkez | metnin merkezi belirlenen konumda yerleştirilmiş. |
| sol | metin sola yuvarlanmış. |
| sağ | metin sağa yuvarlanmış. |
teknik ayrıntılar
| 默认值： | start |
|---|
Tarayıcı desteği
Tablodaki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtmektedir.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Açıklama:Internet Explorer 8 ve daha eski sürümler <canvas> öğesini desteklememektedir.
