ベストアンサー

HTML5　Canvasそのものの原点の指定方法

2011/11/05 11:19

お世話になります HTML5のcanvasタグについて教えてください例えば <canvas id="target" style="border: 5px solid gray" width="200" height="400"></canvas> と書くと200[px]x400[px]の枠が付いたキャンバスがウィンドウの左上の隅の方にできるかと思います。このキャンバス枠をウィンドウの真ん中あたりに表示させたいので Canvasの原点をずらしたいのですが、どうやったらいいのでしょうかご回答くださいますようお願いします

2011tkxp
お礼率94% (159/169)

HTML
回答数1
ありがとう数2

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

ORUKA1951
ベストアンサー率45% (5062/11036)

2011/11/05 12:01 回答No.1

cnavasはフレージングコンテンツ(HTML4で言うところのinline要素など)ですから、imgと同じ扱いです。　セクショニングコンテンツやヘッディングコンテンツ・・(HTML4で言うところのブロック要素)ではありませんから、通常はブロック要素に入るはずです。 <p>これはキャンバスの見本です。<canvas>・・・</canvas></p> ボディ要素直下に入ることはありません。imgもそうしていたと思います。 <body> 　<img> はダメ!!!。 <body> 　<div> 　　<p>・・・</p> 　　<img> 　　<p>・・・</p> 　</div> </body> も同様です。ブラウザは匿名ブロックを作りますが、望ましくはない。対処は、それが挿絵なら <figure> 　<figcaption></figcaption> 　<canvas>・・・</canvas> </figure> figure{width:210px;margin:0 auto; text-align:cener; } とか、 canvas#target{ display:block; margin:0 auto; } ですかね。　HTML4のimgやobjectと同じに考えてください。それらも中央に置くならそうしたように。