[英]Invalid Property Value on background-image
.up { background-image: url('/design-library/profound_test/images/cab_images/white-arrow-up.png') 50% 50% no-repeat; }
This code is giving me an 'invalid property value' in crome (and safari).这段代码在crome(和safari)中给了我一个“无效的属性值”。 I'm using the exact same code on another page, working correctly.
我在另一个页面上使用完全相同的代码,工作正常。 I cleared my browser cache.
我清除了浏览器缓存。 If I remove 50% 50% no-repeat it works fine.
如果我删除 50% 50% 不重复它工作正常。 Adding either of those 2 properties spikes it again to invalid (testing using developer tools).
添加这两个属性中的任何一个都会使其再次无效(使用开发人员工具进行测试)。
I ran it through ProCSSor as well to clean it up, so I'm not sure where I'm screwing it up...我也通过 ProCSSor 运行它来清理它,所以我不确定我在哪里搞砸了......
Yep because the background-image
property is for the image part only, not the position or repeat properties of the background, use background
:是的,因为
background-image
属性仅用于图像部分,而不是背景的位置或重复属性,请使用background
:
.up {
background: url('/design-library/profound_test/images/cab_images/white-arrow-up.png') 50% 50% no-repeat;
}
Chrome* will also throw this warning (and doesn't display the bg image), if you have a blank space between url
and (
like:如果
url
和(
如:
background-image: url ('img/web-bg.png');
^
(Which was the reason for me to search and find this question but no answer and then doing trial and error.) (这就是我搜索并找到这个问题但没有答案然后反复试验的原因。)
Even if you do everything described above, you may get an "invalid property value" in Firefox.即使您执行了上述所有操作,您也可能会在 Firefox 中得到“无效的属性值”。 The workaround is to convert:
解决方法是转换:
background: url(../img/showcase.jpg) no-repeat top center fixed/cover;
into:进入:
background: url(../img/showcase.jpg) no-repeat top center;
background-attachment: fixed;
background-size: cover cover;
This error also occurs in Chrome when you don't use apostrophes and your file has spaces.当您不使用撇号并且您的文件有空格时,Chrome 中也会发生此错误。 Simply change:
只需更改:
background-image: url(../img/file with spaces.png);
to:到:
background-image: url('../img/file with spaces.png');
只需删除../
并将其用作
background: url(img/showcase.jpg) no-repeat top center;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.