Canvas font attribute
Definition and Usage
font attribute sets or returns the current font attribute of the text content on the canvas.
font The syntax used for the Propriedade font do CSSThe same.
Example
Write a 40-pixel text on the canvas, using the font "Arial":
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="40px Arial";
ctx.fillText("Hello World",10,50);
Syntax
context.font="italic small-caps bold 12px arial";
Attribute value
| Value | Description |
|---|---|
| font-style |
Specify the font style. Possible values:
|
| font-variant |
Specify the font variant. Possible values:
|
| font-weight |
Specify the thickness of the font. Possible values:
|
| font-size / line-height | Specify the font size and line height, in pixels. |
| font-family | Specify the font family. |
| caption | Use the font for title controls (such as buttons, drop-down lists, etc.). |
| icon | Use the font for marking icons. |
| menu | Use the font for menus (drop-down lists and menu lists). |
| message-box | Use the font for dialog boxes. |
| small-caption | Use the font for marking small controls. |
| status-bar | Usar a fonte para a barra de estado da janela. |
Detalhes técnicos
| Valor padrão: | 10px sans-serif |
|---|
Suporte do navegador
Os números na tabela indicam a versão do navegador que suportou plenamente essa propriedade pela primeira vez.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Observação:Os navegadores Internet Explorer 8 e anteriores não suportam o elemento <canvas>.
