media="handheld" 为手持设备添加样式

好久前, Windows Mobile和Exchange最佳实践计划 让我才知道原来还有Pocket PC 模拟器这东西，人穷，买不起智能手机或者PDA，那时刚发现，玩了两个晚上。当然只是玩里面的浏览器，感觉，没意思。

最近听到greengnn 提到手持设备的CSS设计 才再次研究研究…….
不过这次发现一些问题…因为我这次的网页的布局是用了margin的负值来达到效果的..
所以..在模拟器里看有特别明显有问题..
同时发现明明写着 media=”screen” 可..他还是依然读到~

那天跟 Casper 聊时 他说wm5( Windows Mobile 5)里的IE把自己当成屏幕,所以都读.给我的建议是..先载入手持设备的样式后.再用JS判断屏幕大小…大于640都算PC设备,再改成屏幕用的
后来的手机测试我估计 wm5的IE是不认识media=”..”的..只有要就读…….因为我的朋友的手机测试中..一样可以读到 media=”screen” 的样式…

可惜我不喜欢这种方式…他做的是以手持设备为主..只要兼容PC就行…
我所需要的偶尔,也许,万分之一的机会用到.而且估计最多也只是我在公车上或者断网时无聊上上的.
最终决定在服务端得到http头信息来判断客户端是什么…

昨晚上忽悠了N 个朋友帮我测试，不过大家都是用手机,而且是都不是智能手机,直接访问网页时.我用PHP的$_SERVER['HTTP_USER_AGENT']得到的空的…去查IIS日志也看不到..一片空…记得两年前学wap时可以还可以得到手机型号跟手机号..听说好像现在移动不给手机发头信息~
我的w810用自带的浏览器在服务端得到的同样也是空的..不过用JS可以得到是爱可信的NF浏览器….不过用Opera Mini 测试时..得到的是

PHP $_SERVER['HTTP_USER_AGENT'] : Opera/8.01(J2EM/MIDP;Opera Mini/2.0.4509/1372;zh;U;ssr)
JS navigator.userAgent:Mozilla/4.0 (compatible;MSIE6.0;;Linux i686)Opera 7.50[en] 

看着发晕 我的手机有这样帅吗?可CSS支持怎那样烂呢.算了..只要服务端得不到的http头信息都当手机好了.同时改变目标…减少我手机的GPRS流量为第一目标…下载又不没作用的样式跟JS 会提高手机费用

程序改起来很简单..只是判断http头信息里有没有包含有Windows CE(Windows Mobile 的系统 ),Opera Mini,或者是为空的都定成手持设备,不给输出 screen 要用的样式跟脚本..当然,手持设备有那样多种..我只是整了我知道的..谁有完整一点的列表给我一份..嘿嘿..

其实直接把屏幕用的html给手持设备用是不是很好的做法…测试了一下gmail的移动版,,他是重定向到手机专用滴..可惜我太懒了..程序虽然很方便…多做套手持设备的模板..程序在底层判断一下给跳转就行.
也许.有天..我会做.这个是直接在原来的改下样式的.. 传说中的IE4支持还不错…有空再多测试下..

扩展阅读

• CSS Mobile Profile 1.0
• 在PC机上安装Windows Mobile设备的模拟器