1WAP
2HTML5/CSS3
3.
webweb
4. WEB
WEB(:html5/css3)
WEB(,)
: WEB
1
2
3
5.
: http://gs.statcounter.com/
6. Mobile OS Worldwide(6/10 6/11)
31.57%
23.21%
15.22%
14.23%
7. Mobile OS China (2010)
66.88%
15.57%
8.83%
8. Mobile OS China(2010-2011)
58.86%
23.76%
9.61%
3.14%
PS: mtk
9. Mobile Browser - China
62.1%
19.04%
7.59%
2.84%
2.74%
10. Mobile Browser -Worldwide
11. ,
12.
iPhone/Androidwebkit/geckoHTML/CSS/Javascript
WAP2.0XHTML/WAP CSSWEBWAP2.0
WAP1.0WAPWMLWMLscript
wap.163.com/3g.sina.com/wap.taobao.com///demo.x.weibo.com/wap.php
jiepang.com/s//http://3g.renren.com///http://wap.yyyweb.com/index-wap2.php//
13. WAP
WAPWAPHTMLWML 3G,,
14.
> WML(Wireless Markup Language -)
>XHTML Basic (W3C)
>XHTML Mobile Profile (Open Mobile Alliance )
web
15. 16.
WAP(NTTOMAOpen Mobile
Alliance)XMLWMLWAP(X)HTMLWMLWAPNTTcHTML(compact HTML)XHTMLWML
W3CXHTML Basic 1.0XHTML 1.1XHTML 1.1XHTML
17.
XHTML Mobile ProfileWAPWAP2.0XHTML Mobile ProfileXHTMLWebXHTML
BasicXHTML 1.0XHTML BasicXHTML Mobile ProfileXHTML 1.0
WMLXHTML BasicXHTML MP
18.
2009
1.JS
2.KXml
3. Dom API
HTML5
WAP1.1
2010
20. WCSSWAPCSS
WCSS
-wap-accesskey
*#0123456789
input.wcss_class {-wap-accesskey: 4}
WCSS
-wap-input-famat-wap-input-requiredWMLformatemptyokWAPformatemptyokXHTML
MPWCSSWML
WCSS Marquee
WAP
21.
What is XHTML MP?
XHTML MPXHTML Basic,XHTML
XHTML Mobile Profile and XHTML Basic
WAP2.0XHTMLMP(XHTMLMobileProfile)
CSS
WCSS
22.
WAPXHTML Basic /XHTML MPWCSSWML
WinWAPOpenWaveOperaChromeFirefox
WAP
23. HTML5/CSS3
wap3Gwap
XHTML BasicXHTML MPXHTMLHTML5
24. : Flash VS. HTML5
HTML5,
Flash
iPhoneiPadFlash
HTML5
HTML5
Flash
25. Flash player HTML 5 CPU
MacFlash PlayerSafariHTML 5, 2Flash player 10.1. 1.5Flash
playerHTML5, HTML 5Flash playerWindowsFlash player 10.1WindowsFlash
Player
26. XHTML5
html5 flash
html5 canplay canplaythrough 22
canvas
html5
html5 GPU3D
html5javascript apisql iphoneipod touchweb
27.
HTML5HTML5Youtube youku
HTML5DRM
YoutubeHTML5Flash
HTML5/YoutubeFlash/Flash
28. CSS3
Media Query()
media type()css 2media typemedia query()media typeCSS 3media
query
media querymedia type+css
media typemedia query
29. CSS2
Mediatypescreenprint
30. CSS3 Media Queries
CSS3widthheightcolor
media="screenand(min-width:480px),print,csser"/>
mediasample.css480pxcsser
media
and
@media(min-width:480px)all
31. CSS3 Media Queries
css
@mediascreenand(min-width:480px),print,csser{selector:{...}}
@media screen and (max-width:240px){ body{ font-size:12px; }
}
240px
PS:CSS
media type+CSSCSSand
@media screen and (min-width:1024px) and (max-width:1280px){
body{ font-size:12px; } }
32. iPhoneiPad
