
在中國,很多前端開發初學者都會把xHTML+CSS頁面制作說成DIV+CSS,甚至很多人都還不知道xHTML+CSS是
什么意思,只知道盲目的追求DIV+CSS,但在國外,是沒有DIV+CSS這個概念的,很明顯如果單從字面上去理解,DIV+CSS的網頁就要全都是
div,很明顯是無法達到語義化標準的。彬Go也希望通過博客讓所有讀者正視代碼語義化的重要性,請把”DIV+CSS”這個詞從腦子中刪除,
用”xHTML+CSS”替代吧!
今天彬Go將向大家推薦43個實例xHTML+CSS(DIV+CSS)網頁及導航布局教程,在國外也可以叫做PSD2XHTML。如果你是以為網
頁設計師,可能會對將自己的效果圖實現成語義化的xHTML頁面感到頭痛,還有一些CSS初學者對于xHTML+CSS處于懵懂狀態,希望大家通過這43
個”DIV+CSS”實例教程學習到語義化xHTML+CSS布局的精髓,即使你已經成為高手,我也相信其中有你值得學習的地方。
您還可以參考以下CSS相關教程:
《精選30個優秀的CSS技術和實例》
《使用CSS創建三列固定布局結構》
《30個基于CSS的導航和按鈕優秀設計教程》
《300+Jquery, CSS, MooTools 和 JS的導航菜單資源》




感興趣的話也可以看看這個實例的設計教程,已譯成中文
網頁設計教程:使用Photoshop設計一個高檔時尚的網頁


這是個非常棒的關于使用Illustrator制作頁面,Drupal(世界最著名的CMS系統之一)編碼,符合標準的xHTML+CSS
完整教程索引:
第一部分:使用Illustrator設計頁面
第二部分:使用Illustrator切圖
第三部分:寫xHTML
第四部分:Drupal主題模板
第五部分:Drupal管理
第六部分:總結和一些附加資源












19.CSS菜單教程

這個教程將教你使用Photoshop制作簡潔的縱向菜單。
























如果你能把這些xHTML+CSS(DIV+CSS)實例教程看一遍的話,我相信你一定會擁有扎實的基礎來使用符合Web標準的xHTML+CSS實現更加高級的布局。
留意更新
訂閱彬Go以查看前端開發/xhtml+CSS最新教程及資源。
英文原文:43 PSD to XHTML, CSS Tutorials Creating Web Layouts And Navigation
翻譯原文:43個實例xHTML+CSS(DIV+CSS)網頁及導航布局教程(暴風彬彬)