有关我面临的问题,请参阅http://jsfiddle.net/2A3xZ/ 。滚动后图像应该在右下角,而不是在第一次绘制的视口的右下角。
使用
.someclass {
position: relative;
}
.image {
position: absolute;
bottom: 0px;
right: 0px;
}
然后由于某种原因将div包含在彼此内部不起作用(整个图像就消失了)。我在这里想念什么?
有关我面临的问题,请参阅http://jsfiddle.net/2A3xZ/ 。滚动后图像应该在右下角,而不是在第一次绘制的视口的右下角。
使用
.someclass {
position: relative;
}
.image {
position: absolute;
bottom: 0px;
right: 0px;
}
然后由于某种原因将div包含在彼此内部不起作用(整个图像就消失了)。我在这里想念什么?
用来position: fixed;
代替position: absolute;
. 这是显示此的小提琴:http: //jsfiddle.net/VbV3P/
编辑:在OP的评论之后:
你应该能够适用position: relative;
于你的身体。请参阅以下内容:
HTML:
<body>
<div class="corner">
<img src="http://wtactics.org/wiki/images/2/2b/Box.png" />
</div>this
<br>is
<br>the
<br>site
<br>content
<br>which
<br>will
<br>cause
<br>the
<br>page
<br>to
<br>scroll
<br>vertically
<br>because
<br>of
<br>its
<br>amount
<br>of
<br>lines.
<br>that
<br>is
<br>expected
<br>behaviour
<br>and
<br>working
<br>as
<br>is
<br>should
<br>be.
<br>however,
<br>the
<br>box
<br>on
<br>the
<br>lower
<br>right
<br>corner
<br>should
<br>be
<br>at
<br>the
<br>current
<br>page's
<br>lowest
<br>corner
<br>depending
<br>the
<br>page's
<br>height,
<br>not
<br>just
<br>in
<br>the
<br>corner
<br>of
<br>the
<br>first
<br>drawn
<br>viewport.
<br>
</body>
CSS:
body {
position: relative;
}
.corner {
position: absolute;
bottom: 0px;
right: 0px;
}
这是更新的小提琴:http: //jsfiddle.net/keW4P/
确保图像就在正文的结束标记之前。给它一个位置值:绝对;对:0;底部:0;