Question

如何从蓝色div中删除模糊边缘？ http://jsfiddle.net/p4raT/

<div id="testContainer" style="position: absolute; left: 0px; top: 0px; width: 1500px; height: 1500px; background: red; -webkit-transform-origin: 0% 0%;
-webkit-transform: scale(4.7);  ">      
<div id="testElement" style="position: absolute; left: 5px; top: 5px; width: 101px; height: 203px; background: blue;"><div> 
    <div>

Answer 1

您可以将border: 1px solid blue;添加到#testElement但这是一个肮脏的解决方案，因为边框也会缩放，我不确定这将如何影响其他元素。

See DEMO

更好的解决方案是添加任何webkit过滤器。例如-webkit-filter: blur(0px);。

See DEMO

这是Chrome中的一些渲染错误（可能在其他浏览器中也没有经过测试），添加过滤器只是修复了这个问题。我不知道它是如何工作的。

Answer 2

最近我遇到了同样的问题，并找到了对我有帮助的解决方案

VCP flowlogs

或

>>> A = [-3,-1,0,-1,3,4,0,10,3,7,8,-10,-9,-78]
>>> [a for a in A if a > 0]
[3, 4, 10, 3, 7, 8]

Chrome：转换比例和模糊边缘

2 个答案: