如何将div定位在HTML5画布旁边
如何将div定位在HTML5画布旁边
提问于 2019-10-12 20:54:26
我正在尝试创建一个基于web的绘画软件，并希望定位一个按钮来改变画笔的颜色(我最终会改变这一条)。如何将按钮放置在画布的右侧。
Html和css：
<!DOCTYPE html>
<html lang = "en">
<head>
<title>Paint</title>
<style>
#canvas{
background-color: cadetblue;
}
.button{
/* code to position button next to canvas */
}
</style>
</head>
<body>
<canvas id = "canvas" width = "800" height = "600"></canvas>
<div class = "button">RED</div>
</body>
</html>回答 1
Stack Overflow用户
回答已采纳
发布于 2019-10-12 21:07:18
<canvas>只是一个普通的块元素，所以你可以按照块元素的位置来定位它。您可以在画布和按钮上应用float:left (请使用真正的<button>)，您可以对它们进行display:inline-block，可以在它们周围添加包装器并对其执行display: flex操作，甚至可以对其执行display: grid操作或向其子项添加position: relative和position: absolute。有很多方法可以实现这一点。这是一个很好的起点：https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Introduction
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58354375
复制相关文章
相似问题
腾讯云开发者
