6

我无法让 CSS3 2D 变换在 Android 2.3 中与任何使用默认 webkit 引擎的浏览器（例如默认浏览器、Dolphin HD、Amazon Kindle Fire Silk 浏览器等）一起工作。Android 2.3 webkit 引擎确实支持 2D 变换，我已经能够让一些具有 2D 变换的站点正确呈现，但不是我的站点！

有谁知道 Android 2.3 中可能导致与 2D 转换发生冲突的任何问题？或者，有没有一种好方法可以只针对使用 Android 2.3 webkit 渲染引擎的浏览器的 css？当我使用 Modernizr 时，在这种情况下它不起作用，因为 Android 2.3 浏览器对 2D 转换测试呈阳性。

这是我的网站：http: //StevenGerner.com。在首页上，我将两个元素旋转 -90 度（站点标题和一个 h2 元素），并且两者都不会在 android 2.3 浏览器上旋转。我什至尝试过其他 css 转换，但似乎没有任何转换。如果我将整个页面剥离为基本页面，那么转换工作完美无缺，所以我的网站上可能还有其他冲突，我就是不知道是什么！这是特定于转换的 CSS：

//Applied to the h2 element which says 'howdy' at the top of the page
    #about-front h2 {
        display: inline-block;
        float: left;
        -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=4)"\9;
        -webkit-transform: rotate(-90deg);
        -webkit-transform-origin: 170% 170%;
        -moz-transform: rotate(-90deg);
        -moz-transform-origin: 170% 170%;
        -ms-transform: rotate(-90deg);
        -ms-transform-origin: 170% 170%;
        -o-transform: rotate(-90deg);
        -o-transform-origin: 170% 170%;
        transform: rotate(-90deg);
        transform-origin: 170% 170%;
        width: 1em;
        text-shadow: -1px 0 #777, 0 2px #333, 2px 0 #333, 0 -1px #777;
    }

//Applied to the site title with a media query between 500px and 750px
    div#site_name {
        display: block;
        line-height: 0.85em;
        -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=4)"\9;
        -webkit-transform: rotate(-90deg);
        -webkit-transform-origin: 160% 130%;
        -moz-transform: rotate(-90deg);
        -moz-transform-origin: 160% 130%;
        -ms-transform: rotate(-90deg);
        -ms-transform-origin: 160% 130%;
        -o-transform: rotate(-90deg);
        -ms-transform-origin: 160% 130%;
        transform: rotate(-90deg);
        transform-origin: 160% 130%;
}

该问题也可能适用于 Android 2.2；但是，我目前没有要测试的 2.2 设备。

我真的很感激任何想法、建议和建议！这让我发疯！

4

1 回答 1

2

笔记

Internet Explorer 5.5 或更高版本支持可用于实现类似效果的专有矩阵过滤器。

Gecko 14.0 删除了对 skew() 的实验性支持，但出于兼容性原因，它在 Gecko 15.0 中重新引入。由于它是非标准的并且将来可能会被删除，所以不要使用它。

Android 2.3 有一个错误，如果任何容器 div 具有 -webkit-transform，输入表单会在键入时“跳转”。

来源：https ://developer.mozilla.org/en-US/docs/Web/CSS/transform

更多：https ://code.google.com/p/android/issues/detail?id=12451

于 2013-08-30T08:09:51.400 回答