“ 預計在未來一兩年內，移動終端上網用户將超過 PC 互聯網。” 這話不是我説的，而是出自新浪 CEO 曹國偉之口。當然，我也很認同他的觀點，在無聊的上下班路上、在領導開會高談闊論時、甚至是坐在馬桶上便便的時候，移動終端設備都已經成為了替換電腦隨時隨地可以連接上互聯網的最好工具。而如今最火最潮的移動終端設置無異於蘋果系列的 iPhone 、 iTouch 以及 iPad，也就是説，如果你的網站可以在以上這些移動終端設備上能夠提供更好的用户體驗，也就有可能贏得更多的市場。
本文將以 iPhone 為例，介紹一下如何在眾多移動終端設備上個性化設置你的 WordPress 博客。有 iPhone 的童鞋不妨先用 iPhone 上的瀏覽器 safari 來瀏覽一下本站，看一下和電腦上的瀏覽器看到的有何不同？
哈，沒錯，如圖所示，左右兩圖分別是本站首頁優化前和優化後的比較。在優化之前 iPhone 上瀏覽本站基本上和在電腦上看到的一樣，而在優化之後 iPhone 上瀏覽本站則可以看到一個單欄的頁面。相對電腦顯示器來説，手機顯示屏很小，要在有限的顯示範圍內展現給用户最重點最需要的內容才是王道，所以我把側邊欄、輪播圖、廣告、頂部工具條、評論部分等那些個花裏胡哨的東西給隱藏了，這是如何做到的呢？
其實很簡單，因為我們知道 iPhone 顯示屏的分辨率統一是 480px，那就只需要為這一寬度的設備單獨定義樣式就可以了，就和普通的 CSS 引入方法類似，方法有兩種：
1 、為 iPhone 單獨引入一個新的 CSS 文件 （我就是這麼幹的）
<link rel="stylesheet" type="text/css" media="only screen and (max-device-width:480px)" href="<?php%20%20bloginfo('template_directory');?>/iphone.css" />
把這個放在 header.php 頭部的 style.css 引入文件之後就可以。
2 、直接在 style.css 中修改，把對 iphone 下的樣式定義寫在 style.css 中的最後即可。
@media only screen and (max-device-width:480px) {
.forIphone{
/* style for iPhone */
}
}
@media only screen and (max-device-width:480px) 這種是 CSS3 的寫法，所以你妄想在 iPhone 下用其他什麼扣扣瀏覽器、 UCWEB 等貨去嘗試，此方法只對 safari 等標準瀏覽器有效。
此方法只是一個拋磚，還有更多神奇的玩法等你去開發，比如説如何優化 WordPress 在 iPad 上的顯示？當然，這個方面不只是應用在 WordPress 上，所有支持 CSS3 瀏覽器的用户和網站都能實現這一功能，try try 吧~