Question

有！

我在移动Safari中使用css转换的图像遇到了问题。我将这个案例简化为这个例子：

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="user-scalable=no, initial-scale=0.55, maximum-scale=0.55, minimum-scale=0.55, width=device-width">

    <style>
        body {
            width: 100%;
            height: 100%;
        }
        .img {
            width: 64px;
            height: 64px;
            background-image: url(http://sa-timetobehero-2reallife.netdna-ssl.com/ds1/items/potions/1_winter_event_shield_60_60.jpg);
            background-size: 64px;
        }
        .img_transform {
            transform: translate3d(0,0,0);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }
    </style>
</head>
<body>
    <div class="img"></div>
    <div class="img img_transform"></div>
</body>

结果：

在移动Safari中，第二张图片看起来很模糊。我发现 backface-visibility 属性应该解决这个问题，但是我没有得到一些效果然后添加它。

在移动Safari中使用css转换模糊图像

0 个答案: