“ 預計在未來一兩年內，移動終端上網使用者將超過 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 吧~