Question

我有这个场景，我正在尝试使用图层做两个画布，所以我必须使用position和诸如此类的......然后......它下面的东西......隐藏在画布下面。我如何做到这一点DIV的下一步是在画布的底部？

Answer 1

只需设置'宽度'和＆amp;画布的“高度”为“#screen”。

#screen {
 position: relative;
 border: 4px solid #333;
 /* New stuff */
 width: 512px
 height: 352px;
}

这是jsFiddle：http://jsfiddle.net/THkmG/3/

希望它有所帮助！

Answer 2

是你的“Hello World”。消息即将落后，因为<div id="screen">拥有position:relative;并且您的convas高度为352px，因此您可以在消息div中使用252px的上边距。这是代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>stackoverflow</title>
<style type="text/css">

#screen {position:relative;border:4px solid #333;}
#canvas {
            background:#ABABAB;
            margin:0;padding:0;
            width:512px;
            height:352px;
            }
</style>


</head>

<body>
<div id="screen">
 <canvas id="canvas" width="512" height="352" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>

 <canvas id="drawing" width="512" height="352" 
   style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>

</div>
<div style="float:left; margin: 352px 0 0;">Hello World.</div>
</body>
</html>

CSS - 位置：绝对创造者浮动：左方案..如何解决？

2 个答案: