如果你使用正確的工具，得到一個一致的，堅實的網格佈局到WordPress是一個輕鬆的過程。在本教程中，你將學習到怎樣一步一步在WordPress裏迅速建立一個非常輕便和易於修改的的網格系統。我們將保持設計簡單，使我們可以將目光放在使用合適的工具來建立你的網格上，但請記住，如果需要的話，你可以設計屬於你自己的風格網格。
本教程中我將在WordPress中使用一個默認的Pool主題，爲了告訴你“從頭開始”的目標到正好獲得一個網格的全過程。
步驟1：確定您的網格寬度
在開始之前，你需要確定你的網格將需要有多寬。對於我的WordPress網站，我可以看到，通過使用谷歌瀏覽器的“檢查元素”功能，當你右鍵點擊對象是，我的主列的寬度是450px。這是我找到的最快的方式，可以快速確定網頁上對象的寬度和高度。
步驟2：網格設計
代替手工建立一個網格，如果你想，你可以做，我建議使用許多可用的網格生成工具之一。在本教程中，我將通過MindPlay來使用網格生成器。這是一個非常簡單和輕便的網格生成器。
我希望有一個三列顯示，並需要確保我的像素是450。這樣作出相應的調整，並跳過“導出”選項卡。雖然這肯定是值得自己去探索的。但是在本教程中，我們不將去留意*typography功能.
在“導出”選項卡里，使用最頂端的“樣式表”的框架並向下滾動，直到你看到“網格”的評論。您將複製評論裏的所有到這個框架的底部。它應該只有約30行的<PRE>。
步驟3：更新你的WordPress的樣式表
.......................................................
.........................................................閱讀全文，請點擊整合簡單的CSS網格佈局到WordPress
此文由Sunny of K.N.J來翻譯的。
翻譯來源：K.N.J的博客
相關閱讀
PyQt QtWebKit設置javascript開關 2012/08/15
QtWebKit自定義HttpHeader 2012/08/15
使用float:left來實現橫排的列表框 2012/08/08