0

所以我目前正在开发这个网站：

http://remedia-solutions.com/clientes/0039_kiplingmexico/demo2/

它几乎完成了，但我目前在调整 2 背景图像大小时遇到​​了一些问题。在 Firefox 上，它可以完美运行，但在 chrome 中无法正常工作，第二个背景（文本背景）以错误的方式完全缩短，我只使用 ccs 来执行此操作，所以这是我的 ccs 代码：

#fondo1{
    background-image: url("images/imagesbackground/BACKGROUND-INICIO.jpg");
    background-attachment:  fixed;
    background-position:    top center; 
    background-repeat:      no-repeat;
    background-size:            cover;
    -moz-background-size:       cover;
    -webkit-background-size:    cover;
    position:absolute;
    width:100%;
    height:100%; 
}
#fondo1int{
    background-image: url("images/INICIO.png");
    background-attachment:  fixed;
    background-position:    center center; 
    background-repeat:      no-repeat;
    background-size:            50%;
    -moz-background-size:       50%;
    -webkit-background-size:    50%;
    position:absolute;
    width:100%;
    height:100%; 
}

我在第 2 个 div 上使用 50% 的原因，否则它会像 hela big.Btw 我使用视差，但据我所知它根本不影响。

这是 chrome 上的图像：

http://oi47.tinypic.com/2ivle8i.jpg

火狐上的图片：

http://oi47.tinypic.com/2hr1o9e.jpg

有任何想法吗？

4

1 回答 1

1

-webkit-background-size: 50%;从您的#fondo1int中删除.css，它在两个浏览器中的行为应该相同。

最后，该类应如下所示：

#fondo1int {
   background-image: url("images/INICIO.png");
   background-attachment: fixed;
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 50%;
   -moz-background-size: 50%;
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
}

希望能帮助到你！

于 2012-07-11T23:24:54.967 回答