Najnowsze tutoriale tworzenie stron internetowych
 

HTML canvas textAlign Propery

<Płótno Przedmiot

Przykład

Tworzenie czerwoną linię w pozycji 150. Pozycja 150 jest punktem granicznym dla wszystkich tekstów określonym w poniższym przykładzie. Zbadanie wpływu każdego textAlign wartości nieruchomości:

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);
Spróbuj sam "

Wsparcie przeglądarka

Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje właściwość.

Nieruchomość
textAlign 4.0 9.0 3.6 4.0 10,1

Definicja i Wykorzystanie

Zestawy własności textAlign lub zwraca bieżące ustawienie dla zawartości tekstowej, zgodnie z punktem kontrolnym.

Normalnie, tekst będzie START w pozycji określonej jednak, jeśli ustawisz textAlign = „right” i umieścić tekst w pozycji 150, oznacza to, że tekst powinien kończyć się w pozycji 150.

Tip: Użyj fillText() lub strokeText() Metoda faktycznie wyciągnąć i umieścić tekst na płótnie.

Domyślna wartość: początek
Składnia JavaScript: context .textAlign="center|end|left|right|start";

wartości nieruchomości

wartości Opis Graj
początek Zaniedbanie. Tekst rozpoczyna się w określonym położeniu Graj "
koniec Tekst kończy się w określonym położeniu Graj "
centrum Środek tekst jest umieszczony w określonym położeniu Graj "
lewo Tekst rozpoczyna się w określonym położeniu Graj "
dobrze Tekst kończy się w określonym położeniu Graj "

<Płótno Przedmiot