html - 如何将图像固定在画廊的右下角

标签 html css image

我有一个工作正常的画廊,但我想在画廊的右下角添加一张图片,所以 我想要:

enter image description here

我知道这个 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;
}

但它没有显示在正确的位置...

  • 我如何更改容器代码,使其在右下角具有固定图像?

here is result

请看the complete fiddle

最佳答案

看看这个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%;

希望对你有帮助

关于html - 如何将图像固定在画廊的右下角,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16550620/

相关文章:

javascript - AngularJS - 列表为空时隐藏div

html - CSS 菜单突出显示大小不匹配

jquery-ui - 创建带有半透明下拉菜单的炫酷菜单栏的技巧,例如...(见下文)

iphone - 内部图像需要多种分辨率?

html - 如何使 PrimeNG 表格列自动适应?

javascript - 在 Canvas 上添加不同的平行线

css - 响应式绝对定位背景叠加

html - CSS 下拉菜单链接不起作用

regex - 验证图像的正则表达式

html - 在普通图像之前加载 CSS 背景图像?