コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > フロントエンドQ&A > HTMLキャンバスタグの使い方

HTMLキャンバスタグの使い方

藏色散人
リリース： 2019-05-26 09:15:25
オリジナル
3021 人が閲覧しました

html Canvas タグは、グラフやその他の画像などのグラフィックを定義するために使用されます。 タグは単なるグラフィック コンテナであり、スクリプト (通常は JavaScript) を通じて実行されます。Canvas を使用してパスを描画できます。ボックス、丸、文字、画像の追加。

HTMLキャンバスタグの使い方

#キャンバスとはどういう意味ですか? HTMLキャンバスタグの使い方は？

機能: グラフやその他の画像などのグラフィックを定義します。

説明:

ラベルは単なるグラフィック コンテナであり、スクリプト (通常は JavaScript) を通じて実行されます。キャンバスを使用してパスを描画できます。ボックス、丸、文字、画像の追加も可能です。

注:

タグは、HTML 5 の新しいタグです。 Internet Explorer 8 以前では、 タグはサポートされていません。

html キャンバス タグの例

<!DOCTYPE HTML>
<html>
<body>
<canvas id="myCanvas">your browser does not support the canvas tag </canvas>
<script type="text/javascript">
var canvas=document.getElementById(&#39;myCanvas&#39;);
var ctx=canvas.getContext(&#39;2d&#39;);
ctx.fillStyle=&#39;#FF0000&#39;;
ctx.fillRect(0,0,80,100);
</script>
</body>
</html>
ログイン後にコピー

効果:


HTMLキャンバスタグの使い方

以上がHTMLキャンバスタグの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル：
html canvas标签
ソース：php.cn
前の記事：HTMLボタンタグの使い方 次の記事：HTMLキャプションタグの使い方
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
SQL Count() にも 0 が必要です テーブルが 1 つだけあり、0 で始まるタグの各エントリをカウントしたいと考えています。今度はこれを試します: SELECT tag,COUNT(start)ASAnzahl,us...
から 2024-04-06 19:48:53
0
1
449
CSS スタイルがサイトに適用されない Bootstrap5を使用してWebサイトを作成していますが、index.cssプロパティがindex.htmlに適用されません。サービス カードの上にマウスを移動すると、背景が変...
から 2024-04-06 17:12:23
0
1
336
hr タグが単色白に設定されているのに半透明になるのはなぜですか? HTML（ブートストラップ付き）とCSSがあり、HTMLにはクラスを持つ<hr>タグがあり、CSSにはその境界線スタイルがあります。半透明で白い色は見えますが、「固体」...
から 2024-04-06 16:13:26
0
1
500
ベンダー固有の疑似要素上の JavaScript ホバー イベント 次の htmlinput タグがあります。 $("input[type='range']::-webkit-slider-thumb").on('hover',...
から 2024-04-06 15:35:24
0
1
274
ページのメインディスプレイに画像を表示するにはどうすればよいですか? 私がやりたいのは、NASAAPI を使用して写真を受信することです。これらの写真は、マイページのサムネイルとメインディスプレイに表示されます。コードがサムネイルから画像を取得してペ...
から 2024-04-06 15:33:12
0
1
433
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート