【问题标题】:background-attachment: fixed not working on Safari背景附件:修复无法在 Safari 上运行的问题
【发布时间】:2014-11-16 07:36:43
【问题描述】:

我在一个跨度 100% 的浏览器的元素上运行了以下代码:

#section_white {
  background-attachment:fixed;
  background-image:url(image_url_here.jpg);
  background-position:100% 100%;
  background-repeat:no-repeat no-repeat;
  background-size:cover;
}

我需要做的是让图像跨越浏览器的整个宽度,同时保持固定(从而允许内容在其上滚动)。

它似乎适用于除 Safari 之外的所有浏览器 - 有什么我缺少的想法吗?

我尝试将元素 heightmin-height 设置为 100%,但没有任何乐趣。

演示页面的链接可以在这里看到:http://oscarsarc.tinygiantstudios.co.za/adopt/adopt-nationwide/

【问题讨论】:

  • 您使用的 safari 版本在 ma safari 中看起来很完美。
  • 嗯。奇怪的。在 Win 8.1 上使用 5.1.7
  • 这是版本 7.0.6 mac
  • 多哈。 Windows Safari 在 5.1.7 停止开发。难怪它看起来不好看。
  • 查看我的答案,让我知道它是否有效。

标签: css safari cross-browser background-attachment background-size


【解决方案1】:

原来 Safari for Windows 不再受支持(我怎么会错过这个?!)而且我使用的那个太旧了,无法使用。使用 OSX / Safari,事情看起来很漂亮(根据 Benjamin)

【讨论】:

  • 专业提示:Mac 版 Internet Explorer 也已停产。 :-P
【解决方案2】:

所以这会有所帮助,因为您的 Safari 版本部分支持 background-size,您应该使用 prefix,如下所示

html { 
  background: url(image_url_here.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

试试这个,让我知道任何问题。

SOURCE LINK

CHECK BROWSER SUPPORT

【讨论】:

  • 还是不开心;浏览器前缀只会将 bg 图像向下推。固定图像和封面图像仍然不能很好地融合在一起。
  • 同上。感谢您抽出宝贵的时间。非常感谢。
  • 你在 html 上尝试过 doctype
猜你喜欢
  • 2013-07-13
  • 2016-11-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-03-01
  • 2023-03-15
  • 1970-01-01
  • 2015-12-01
相关资源
最近更新 更多