HTML5 キャンバス issue_html/css_WEB-ITnose

2 つの新しいキャンバスが作成され、それぞれのキャンバスに画像が表示されます。1 つのキャンバスをもう 1 つの画像の上に重ねて表示します。

ディスカッションへの返信(解決策)

座標を設定できるはず
参考
http://www.w3school.com.cn/html5/html_5_canvas.asp
http://www.cnblogs .com/myssh /archive/2011/11/24/2261901.html

これは解決できません

上のキャンバスの背景を透明に設定しますか?あなたのニーズを満たすかどうか試してみてください。 & & Lt; スタイル タイプ = "text/css" & gt; #c1 {
ボーダー: 1px ソリッド
}
;/頭>
<ボディ> <キャンバス id="c1" 幅="1400" 高さ="350"> <キャンバス id="c2" 高さ="1000" ="300">
<script> <br> var context1 = document.getElementById ("c1").getContext("2d"); "c2").getContext("2d"); <br> var img1 = 新しい画像(); <br> var img2 = 新しい画像(); "; <br> img1.onload=function(){ <br> context1.drawImage(img1,0,0); <br> } <br> img2.onload =function(){ <br> context2.drawImage(img2,0,0); <br> } <br> context2 .globalAlpha=0.5; <br> <br> </script>

キャンバスを 1 つだけ使用するのに、なぜ 2 つ必要なのでしょうか?

floatやmarginは使えないのでしょうか？

キャンバスを 1 つ使用するだけですが、なぜ 2 つ必要ですか?
1 つのキャンバスに 2 つの写真を配置すると、大きい方が小さい方の写真を覆い、上に浮く効果はありません。 QQスペースのフォトアルバムとほぼ同じです