[Go] mobile Web development Experience Summary

1.-webkit-tap-highlight-color:rgba (255,255,255,0) can simultaneously block the shadow that appears when clicking on an element under iOS and Android.

Note: The transparent property value is not valid under Android. 2,-webkit-appearance:none can simultaneously block the input box strange inner shadow. 3,-webkit-transform:translate3d (0, 0, 0) can make the animation smoother under iOS (this property calls Hardware acceleration mode), but not in Android, many unseen bug is because of this. 4, @-webkit-keyframes can be predefined many of the animation you think of, and then through the-webkit-transition to invoke. 5,-webkit-background-size can do high-definition icons, but some of the lower version of Android can only recognize Background-size, so it is necessary to write two, it is recommended to use this attribute tree yong cover this value, can automatically go to match width and height. 6, Text-shadow more Use this attribute, can beautify the text effect. 7, Border-radius, Box-shadow, gradient, border-image, do not explain, you can streamline the code. 8, Android, iOS4 and below, fixed-width/blocks-level elements of the Overflow:scroll/auto failure, belonging to the browser bug, can be achieved by third-party tools. 9, ios5+ can be Scrollto (0,0) to automatically hide the browser address bar. 10, <meta name= "viewport" content= "initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, User-scalable=no, Width=device-width ">width is width, Initial-scale initializes the scale, maximum-scale the maximum scale that allows the user to scale, minimum-scale the minimum scale that allows the user to scale, User-scalable whether the user is allowed to scale.

11, allow the user to add to the home screen, and provide webapp support.

12. CSS3 animation will affect your autofocus, so auto-focus should be done before the animation is executed, or discarded directly.

13. Use media query to fit different screens.

14, if involves more outside the domain link, the DNS prefetching can help you do the DNS pre-parsing.

15, if you want your site to spread more in SNS, then open Graph protocol will be more suitable for you.

16, when using iscroll time, can not use: focus{outline:0} pseudo-class, otherwise sliding card.