野生动物园的背景是扭曲的

Question

我正在新客户的网站上工作，除了safari之外，每个浏览器的一切都很好看。问题：背景图像没有响应safari中的css（5px大小）。

.et_pb_section_0 {  /* The background CSS */
    background: url(http://www.elsyf-staging.com/esm/wp-content/uploads/2016/05/bg.png) 5px;
}

我无法找到有关此问题的任何确切信息。

由于Safari与chrome共享webkit功能，因此尝试通过该功能解决此问题导致站点损坏。有没有办法专门针对野生动物园？

Answer 1

在CSS background速记属性中，background-position位于background-size之前。这会使您的5px与background-position相对应，而不是background-size。

要解决此问题，请添加background-position并使用斜杠将其与background-size分开：

.et_pb_section_0 {
    background: url("http://www.elsyf-staging.com/esm/wp-content/uploads/2016/05/bg.png") 0 / 5px;
}

或者，分别定义background-image和background-size：

.et_pb_section_0 {
    background-image: url("http://www.elsyf-staging.com/esm/wp-content/uploads/2016/05/bg.png");
    background-size: 5px;
}