例
フォントを使用して、キャンバス上30px高テキストを書く"Arial"
JavaScriptを：
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="30px Arial";
ctx.fillText("Hello World",10,50); »それを自分で試してみてください ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
| プロパティ | |||||
|---|---|---|---|---|---|
| font | はい | 9.0 | はい | はい | はい |
定義と使用法
フォントプロパティセットやキャンバス上のテキストコンテンツの現在のフォントプロパティを返します。
フォントプロパティは、同じ構文を使用してCSSのフォントプロパティ 。
| デフォルト値： | 10pxののサンセリフ |
|---|---|
| JavaScriptシンタックス： | context.font="italic small-caps bold 12px arial"; |
プロパティ値
| 価値観 | 説明 | それを再生します |
|---|---|---|
| font-style | フォントスタイルを指定します。 可能な値：
| それを再生します» |
| font-variant | フォントバリアントを指定します。 可能な値：
| それを再生します» |
| font-weight | フォントの太さを指定します。 可能な値：
| それを再生します» |
| font-size/line-height | フォントサイズや行の高さをピクセル単位で指定します | それを再生します» |
| font-family | フォントファミリを指定します。 | それを再生します» |
| caption | （ボタンなど、ドロップダウン、など）フォントキャプション付きコントロールを使用します | それを再生します» |
| icon | アイコンにラベルを付けるために使用されるフォントを使用します | それを再生します» |
| menu | メニュー（ドロップダウンメニューとメニューリスト）で使用されるフォントを使用します | それを再生します» |
| message-box | ダイアログボックスで使用するフォントを使用します | それを再生します» |
| small-caption | 小さなコントロールを標識するために使用されるフォントを使用します | それを再生します» |
| status-bar | ウィンドウのステータスバーで使用されるフォントを使用します | それを再生します» |