Question

我已经在我的rails应用中实现了这个：animated header。一切正常但我想改变标题图像，由于某种原因它没有加载...我在不同的页面上尝试了相同的语法来加载图像，它在rails中工作正常。

我如何才能完成这项工作以及我缺少什么？

我更改的CSS代码

.header:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ(0) scale(1.0, 1.0);
  transform: translateZ(0);
  background-image: asset-data-url("header_background.jpg");
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: top center;
  background-color: #1B2030;
  background-size: cover;
  -o-background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  animation: grow 60s linear 10ms infinite;
  transition: all 0.2s ease-in-out;
  z-index: -2;
}

来自codepen的代码

.header:before{
  content:"";
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ(0) scale(1.0, 1.0);
  transform: translateZ(0);
  background:#1B2030 url(https://unsplash.it/1999/999?image=1063) top center no-repeat;
  background-size:cover;
  background-attachment:fixed;
  animation: grow 60s  linear 10ms infinite;
  transition:all 0.2s ease-in-out;
  z-index:-2
}

Answer 1

好的，我已经弄明白了！我在脚本标签的视图中使用了css这就是它无法加载的原因...我猜资产数据网址只有当它在css文件中实现时...

Background-image不会加载Ruby on Rails上的图像

1 个答案: