0

我试图标记一张图片以显示在网页的右下角。

如果我将页面的整体宽度设置为 100%,并且我将图片设置为在底部右侧浮动,它会完美地实现这一技巧,但上面提到的图片是一个更大宽度的图片,大约 1600 像素,所以当你打开页面时小窗口浏览器然后浮动图片对齐但滚动条出现并滚动到页面的整个宽度而没有浮动图片..

body{width:100%;}
thepicture{width: 1289px;
height: 446px;
position:relative;
float:right;}

所以第二种方法:使 body 或 wrapper div 固定宽度大于上面提到的图片:

身体{最小宽度:1600px;}

在有人的屏幕大于 1600 像素之前看起来很棒……浮动以 1600 像素结束;

第一个解决方案需要调整,但我无法弄清楚如何,一些响应式浮动可能会很棒 jquery?感谢转发

问题是珍珠:)

4

3 回答 3

0

听起来您需要在这里使用背景图像。将背景放在 100% 宽度的 div 上,并将背景位置设置为right bottom.

div.background{background: url('images/bg.png') no-repeat right bottom; width: 100%}
于 2013-01-16T18:02:59.980 回答
0

试试看position: fixed; z-index: -1;,它完全符合您的要求。 例子

于 2013-01-16T18:14:18.623 回答
0

更新

可能是这项工作:

body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%
    min-width: 1648px; /* the width of the longest element */
}

#bottomwrap {
    /* replace with your background color */
    background: url(path/to/picture) bottom right no-repeat;
    width: 100%;
} 

记住重置body marginpadding归零并设置body height为 100%

更新:

我已经为您的案例更新了解决方案,修改了 HTML 结构,您可以在此处查看http://jsbin.com/ulatis/1/edit

于 2013-01-16T18:17:45.147 回答