这是我的网站:http://www.alexklinghoffer.com/
如何将背景图片保留在底部?如果你把浏览器窗口变小,图像会漂移到顶部,但我想把它放在右下角。这是我的代码:
HTML:
<body>
<div class="logo">
<a href="http://www.alexklinghoffer.com"><img id="logo" src="images/aklogowhite.png" alt="Alex Klinghoffer Logo"/></a>
</div>
<div id="dock">
<ul>
<li><a href="/index.html"><span> Home </span><img src="images/home.png" alt="[photo]" /></a></li><!--
--><li><a href="/bio.html"><span> Bio </span><img src="images/bio.png" alt="[photo]" /></a></li><!--
--><li><a href="/resume.html"><span> Resume </span><img src="images/resume.png" alt="[photo]" /></a></li><!--
--><li class="active"><a href="/collections.html"><span> Collections </span><img src="images/collections.png" alt="[photo]" /></a></li><!--
--><li class="active"><a href="/references.html"><span> References </span><img src="images/references.png" alt="[photo]" /></a></li><!--
--><li><a href="/contact.html"><span> Contact </span><img src="images/email.png" alt="[photo]" /></a></li><!--
--><li><a href="/blog.html"><span> Blog </span><img src="images/blog.png" alt="[photo]" /></a></li><!--
--><li><a href="http://www.facebook.com/alexklinghoffer"><span> Facebook </span><img src="images/facebook.png" alt="[photo]" /></a></li><!--
--><li><a href="http://www.linkedin.com/in/alexklinghoffer"><span> LinkedIn </span><img src="images/linkedin.png" alt="[photo]" /></a></li>
</ul>
</div>
<div id="content">
</div>
<div id="footer">
<p>© 2013 <a href="http://www.alexklinghoffer.com">Alex Klinghoffer</a></p>
</div><!--//footer-->
</body>
</html>
CSS
body {
background: url("images/background.png");
background-size: cover;
background-repeat: no-repeat;
background-color: #111111;
padding: 0;
margin: 0;
}
提前致谢!
最佳答案
你应该可以这样做,
background-attachment:fixed;
background-position:center bottom;
添加附件 fixed 确保它在发生任何滚动时保持在同一个位置。
如果这样不行你也可以试试,
html {height: 100%;}
body {
background-position: 0% 100%;
background-attachment: fixed;
}
关于html - 如何将背景图片保留在页面底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15098491/