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