HTML холст TextAlign недвижимость

примеров

Создать красную линию в позиции 150. Позиция 150 определяется в следующих примерах все якорный текст. Пожалуйста, изучите влияние каждого значения свойств TextAlign:

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

Попробуйте »

Поддержка браузеров

Internet Explorer 9, Firefox, Opera, Chrome и Safari поддержка TextAlign собственности.

Примечание: 8 и более ранние версии Internet Explorer не поддерживают элемент <Canvas>.

Определение и использование

TextAlign атрибуты в виде наборов анкерных или возвращает текстовое содержимое текущего выравнивания.

Как правило, текст ,начинающийся в указанном месте, но если вы установите TextAlign = "право" и текст помещается в положение 150, положение 150 в конце.

Совет: Используйте fillText () или strokeText () метод на самом деле рисовать и позиционировать текст на холсте.

По умолчанию:	старт
Синтаксис JavaScript:	Контекст .textAlign = "центр \| конец \|влево \| вправо \| старт";

Значение свойства

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

HTML холст Справочное руководство

Предыдущая: HTML атрибуты холст шрифта