设置背景附件:固定并仍然使用背景位置

时间:2014-11-07 05:56:02

标签: css image background-image background-attachment

我试图将背景封面图像放在图像的左下角(background-position: 0% 100%;),同时修复位置,使图像不会滚动。

问题是,background-position在使用background-attachment:fixed时被忽略。

一些示例HTML:

<div class="title-section">
  <div class="wrap">
    <h4 class="widget-title widgettitle">My Cool Title</h4>
  </div>
</div>
<div class="footer-section"></div>

相关的CSS:

.title-section {
  background-image: url(image.jpg);
  background-position: 0% 100%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
}

如果我删除background-attachment或将其更改为滚动,则会正确定位图像。我需要什么才能使图像保持在固定位置,但该位置是图像的左下角?

我已尝试通过<img>标记添加图片,但无法使其生效。

如果您想使用代码,我可以在JS Fiddle上添加它:http://jsfiddle.net/bradonomics/xtjmyv7y/2/

如果您取出CSS第5行background-attachment属性,您可以在地板上看到地毯。

0 个答案:

没有答案