CSS3 Compatibility List on different models of mobile browsers

The online collection of CSS3 support for different system mobile browsers (Ios/android/winphone) back up for review. The following information by the product department "White Tree" collation, reproduced please specify.

√: Full support √: Partial support x: Unsupported (-webkit): Add-webkit prefix only support (-MS): Add-ms prefix to support


CSS3 Summary:

For the WebKit kernel browser, in addition to media, Text-shadow, the use of other properties is basically prefixed with WebKit.

Gradient rendering is not rich in low-version systems

ios3.2~4.3 does not support position:fixed, it is not recommended

android2.1~2.3 support for animations is not rich

android2.1~2.3 does not support Translate3d, it can be used in conjunction with media to write low-end Android version of the CSS hack

For Winphone's IE browser

IE9~11 supports media, Box-shadow, Border-radius

IE9 not supported for animations

IE9 does not support box layout

IE9 does not support gradients, depending on the situation can be appropriate to use IE filter

Only IE9 is supported: {attribute: Property value 9;}

The above-mentioned, in WebApp development, we can divide mobile devices into low-end systems (IE9, android2.1~3.0, ios3.2) and high-end systems (ios4+, android4.1~4.2),

For low-end systems, with a common solution, and with hack compatibility, for high-end systems, you can use a richer and more cool effect.

Mobile device replacement Soon, the latest version of various mobile phone system has supported the majority of CSS3 effect, I believe that in the future support for CSS3 can be achieved unity.

CSS3 Compatibility List on different models of mobile browsers