小编典典

我可以在画布内放置HTML按钮吗?

css

我想将要制作的游戏按钮制作为真正的HTML按钮,但它们必须位于画布内。

我将如何去做呢?


阅读 619

收藏
2020-05-16

共1个答案

小编典典

鉴于canvas元素具有透明的内容模型,它可能包含 后备 元素,如果该canvas元素不受支持,则会显示该元素。如果支持画布,
不会 显示它们。 __

您可以相对于画布的父对象放置HTML元素,以使按钮“悬停”在画布上。甲菜单元件可以是适当的语义元素来呈现的控件的列表,这取决于上下文:

HTML:

<div id="container">
  <canvas id="viewport">
  </canvas>
  <menu id="controls">
  </menu>
</div>

CSS:

#container
{
  height: 400px;
  position: relative;
  width: 400px;
}
#viewport
{
  height: 100%;
  width: 100%;
}
#controls
{
  bottom: 0;
  left: 0;
  position: absolute;
  width: 100%;
}
2020-05-16