当使用带有背景重复的alpha png时，会出现IE10工件 [英] IE10 artifacts appear when using alpha png with background-repeat
问题描述
我在Windows8下面的IE10有以下问题，只是使用简单和简单的div与repeat-x背景和使用透明png文物出现。
结果：
http://s18.postimg.org/9tn3dlsqx/artifacts.png
以下是示例代码：
CSS
div.field {height：762px; background-image：url（../ img / background_grass.png）repeat-x; width：5000px; left：-700px; position：absolute; }
div.graphics {overflow：hidden; width：3840px; position：absolute; background：url（../ img / path_1.png）; height：640px; top：315px; left：-1000px;}
和html
<！DOCTYPE html>
< html>
< head>
< title> MyForest - Идеяпо-чисто< / title>
< meta charset =UTF-8/>
< link href =styles / styles.css =stylesheet/>
< / head>
< body>
< div class =field>< / div>
< div class =graphics>< / div>
< / body>
我有同样的问题。尝试更改图片的高度或宽度。
这种情况似乎发生在大png背景图片中，当它们重复时具有一定的高宽比。在我的情况下，图像是2000px宽和1000px高，背景的右侧结束重叠88像素（背景结束了2088像素。在我的情况下，我使用透明png包装图形是稍微透明。即使陌生人，如果我使图像2000px由2000px的问题消失。
这太糟糕了...我希望IE已经改进了版本10，不得不再处理这些怪癖。
I'm having the following problem in IE10 under Windows8, just using plain and simple div with a repeat-x background and when using a transparent png artifacts appear.
Results: http://s18.postimg.org/9tn3dlsqx/artifacts.png
Here's sample code:
CSS
div.field { height: 762px; background-image: url(../img/background_grass.png) repeat-x; width: 5000px; left: -700px; position: absolute; }
div.graphics { overflow: hidden; width: 3840px; position: absolute; background: url(../img/path_1.png); height: 640px; top: 315px; left: -1000px;}
And the html
<!DOCTYPE html>
<html>
<head>
<title>MyForest - Идея по-чисто</title>
<meta charset="UTF-8" />
<link href="styles/styles.css" rel="stylesheet" />
</head>
<body>
<div class="field"></div>
<div class="graphics"></div>
</body>
I'm having the same issue. Try changing the height or width of your image.
It seems to happen with large png background images that have a certain height to width ratio when they are repeated. In my case the image is 2000px wide by 1000px tall and the right side of the background ends up overlapping by 88 pixels (the background ends up being 2088 pixels. In my case I am using a transparent png with wrapping graphics that are slightly transparent. Even stranger, if I make the image 2000px by 2000px the problem goes away.
It's too bad... I was hoping IE had improved with version 10 and we wouldn't have to deal with these kind of quirks anymore.
这篇关于当使用带有背景重复的alpha png时，会出现IE10工件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
![http://s18.postimg.org/9tn3dlsqx/artifacts.png](\"http://s18.postimg.org/9tn3dlsqx/artifacts.png\"){kind=link}
