我有一个画廊工作正常,但我想在画廊的右下角添加一个图像 我想:
我知道这个CSS可以解决它:
#container_logo {
position:fixed;
right:0;
bottom:0;
margin:0;
width:75%;
height:75%;
background:url(http://blog.logobee.com/free-logo1.jpg) no-repeat bottom right;
background-size:100%;
}
但是如何将它添加到当前代码中?
我尝试添加额外的行background:url(http://blog.logobee.com/free-logo1.jpg)
:
#containingDiv {
width:100%;
margin:0 auto;
padding:0px 0 0 0;
background:url(http://blog.logobee.com/free-logo1.jpg) no-repeat bottom right;
}
但它没有显示在正确的位置......
答案 0 :(得分:1)
尝试将包含徽标的div
的宽度设置为包含图片的div
的宽度(确保这是一个不变的数字,例如百分数)。如果高度和宽度与较大的图片相同。为徽标设置bottom: 0px; right: 0px;
会使其显示在图片的右下角。如果您使用margin
和padding
来调整主要图片的位置,请确保它包含在徽标图片中,以便无论在何处查看大小窗口,它们都位于同一位置。
答案 1 :(得分:1)
看看这个http://jsfiddle.net/KGk9f/5/
您需要添加
<div id="container_logo"></div>
到
<div id="containingDiv">
并进行一些CSS更改......
#containingDiv {
width:680px;
height:470px;
position:relative;
margin:0 auto;
padding:0px 0 0 0;
}
#container_logo {
position:absolute;
z-index:500;
width:150px;
height:150px;
right:0;
bottom:0;
margin:0;
background:url(http://blog.logobee.com/free-logo1.jpg) no-repeat bottom right;
background-size:100%;
}
希望它有所帮助...