我有多个画布相互分层,基本上我正在制作一个有历史和删除的绘画应用程序。画布与父div的宽度不同。
我正在桌子上敲打我的画布试图将画布放在div中,直到我读到this answer,这几乎是最低的投票问题。
简而言之:
只有当您的画布与容器的宽度相同时,上述答案才有效。
无论如何都可以:
#container {
margin: 0px auto;
text-align: center;
}
如果我评论文字对齐我的画布偏离中心。
问:这有什么意义,为什么text-align会对canvas元素产生影响?
关于CSS有一些奇怪的怪癖,我以类似的方式学习并经常使用。我认为理解这将是胸部使用的另一个工具。
答案 0 :(得分:1)
canvas
是内联元素(就像img
,input
等),因此它显示在文本流中。运行下面的示例以查看示例。
赋予画布display: block
以使其成为块元素。
<p>This is a longer text with inline elements such as canvas <canvas style="width: 1em; height: 1em; border: 1px solid red;"></canvas>, image <img src="http://lorempixel.com/20/20/" /> and an <input type="button" value="input" /> element.</p>
<p>Give the canvas <code>display: block</code>, like this one <canvas style="width: 1em; height: 1em; border: 1px solid red; display: block"></canvas>, so that it becomes an block element.</p>