<キャンバス>
HTML <canvas>タグ
インスタンス
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<canvas id="myCanvas">你的浏览器不支持 HTML5 canvas 标签。</canvas>
<script>
var c=document.getElementById('myCanvas');
var ctx=c.getContext('2d');
ctx.fillStyle='#FF0000';
ctx.fillRect(0,0,80,100);
</script>
</body>
</html>インスタンスを実行する»
オンラインインスタンスを表示するには、「インスタンスを実行」ボタンをクリックしてください
ブラウザサポート
IE 9 、Firefox、Opera、Chrome、Safari は <canvas> タグをサポートしています。
注: IE 8 以前のバージョンの IE ブラウザは <canvas> タグをサポートしていません。
タグの定義と使用手順
<canvas> タグは、スクリプト (通常は JavaScript) を使用してグラフィック (グラフやその他の画像など) を描画します。
<canvas> タグは単なるグラフィック コンテナであり、グラフィックを描画するにはスクリプトを使用する必要があります。
HTML 4.01とHTML5の違い
<canvas>タグはHTML5の新しいタグです。
ヒントとメモ
注: <canvas> 要素内のテキストは、<canvas> をサポートしていないブラウザーで表示されます。
ヒント: Canvas オブジェクトのすべてのプロパティとメソッドについて詳しくは、HTML Canvas リファレンス マニュアルを参照してください。
属性
New : HTML5 の新しい属性。
| Property | Value | Description |
|---|---|---|
| heightNew | pixels | キャンバスの高さを指定します。 |
| widthNew | pixels | キャンバスの幅を指定します。 |
グローバル属性
<canvas> タグは HTML グローバル属性をサポートします。
イベント属性
<canvas> タグは HTML イベント属性をサポートします。
