font 속성
font 속성은
fillText
메서드 또는 strokeText 메서드를 사용하여 canvas에 글꼴을 그릴 때의 설정을 지정합니다.
이 메서드는 CSS의 font 속성과 동일한 매개변수를 받습니다.
구문
컨텍스트.font = 글꼴 설정;
예제
fillText를 사용하여 canvas에 텍스트를 그리고,
font를 사용하여 크기를 30px로, 글꼴을 Arial로 설정해 보겠습니다:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.font = '30px Arial';
ctx.fillText('Hello world', 30, 50);
:
참고
-
textAlign속성,
텍스트를 수평으로 정렬합니다. -
textBaseline속성,
텍스트를 수직으로 정렬합니다.