Question

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

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%; 
}

我在第二个div使用50％因为否则它会像hella big.Btw我使用视差但据我所知它根本不会影响。

照片上的图像：

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

firefox上的图片：

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

有什么想法吗？

Answer 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;
}

希望它有所帮助！

调整chrome上的背景图像问题

1 个答案: