HTML5 캔버스 텍스트의 스타일을 굵게 및 / 또는 기울임 꼴로 어떻게 지정합니까?

HTML5 캔버스 텍스트의 스타일을 굵게 및 / 또는 기울임 꼴로 어떻게 지정합니까?

---

캔버스에 텍스트를 매우 간단하게 인쇄하고 있습니다.

var ctx = canvas.getContext('2d');
ctx.font = "10pt Courier";
ctx.fillText("Hello World", 100, 100);

하지만 텍스트를 굵게, 기울임 꼴 또는 둘 다로 변경하려면 어떻게해야합니까? 이 간단한 예를 수정하기위한 제안이 있습니까?

---

다음 중 하나를 사용할 수 있습니다.

ctx.font = "italic 10pt Courier";

ctx.font = "bold 10pt Courier";

ctx.font = "italic bold 10pt Courier";

자세한 내용은 다음 두 가지 리소스를 참조하십시오.

• HTML5 살펴보기
• 캔버스에 텍스트를 표시하는 방법
• HTML5 Canvas-기본 사항

---

이 문제를 발견하는 사람을 위해 추가로 알려드립니다. 수락 된 답변에 표시된 순서를 따르십시오.

주문이 잘못되었을 때 브라우저 간 문제가 발생했습니다. "10px Verdana bold"는 Chrome에서 작동하지만 IE 나 Firefox에서는 작동하지 않습니다. 표시된대로 "bold 10px Verdana"로 전환하면 이러한 문제가 해결되었습니다. 비슷한 문제가 발생하면 주문을 다시 확인하십시오.

---

캔버스 메서드 또는 속성을 통해 밑줄을 칠 수 없습니다. 그러나 나는 그것을 끝내기 위해 몇 가지 작업을 수행했습니다. http://scriptstock.wordpress.com/2012/06/12/html5-canvas-text-underline-workaround에서 확인할 수 있습니다 .

http://jsfiddle.net/durgesh0000/KabZG/ 에서 구현을 찾을 수 있습니다.

---

그래서 하나의 JS 명령에 설정 font-weight( font-size또는 font-family...) 할 방법이 없습니까? 모두 하나의 완전한 글꼴 문자열에 있어야합니까?

참고 URL : https://stackoverflow.com/questions/5158222/how-do-i-style-html5-canvas-text-to-be-bold-and-or-italic