前言

FOREWORD

隨著互聯(lián)網(wǎng)行業(yè)的持續(xù)發(fā)展，移動互聯(lián)網(wǎng)等新業(yè)務(wù)不斷發(fā)展壯大，海量的平臺開發(fā)工作形成了巨大的人才缺口，尤其是 Web 前端、移動端 HTML5 開發(fā)人才更為緊缺。隨著互聯(lián)網(wǎng)業(yè)內(nèi)競爭的不斷加劇，企業(yè)平臺開始在界面友好性和操作方便性方面投入更多的精力，只有平臺更加人性化，才能吸引更多的用戶，所以Web開發(fā)人員的地位在業(yè)內(nèi)開始迅速提高。

為什么要學(xué)習(xí)本書

一個優(yōu)秀的 Web 開發(fā)工程師需要具備一定的綜合素質(zhì)才能勝任企業(yè)日益復(fù)雜多變的工作要求。這些素質(zhì)包括熟知頁面布局，熟練樣式美化，掌握JavaScript基礎(chǔ)，熟悉Bootstrap響應(yīng)式布局設(shè)計，能夠使用HTML5+CSS3開發(fā)出炫麗的移動端交互效果等，而本書正為此應(yīng)運而生。

如何使用本書

本書分為8個單元，每個單元由2~4個項目組成，以項目為導(dǎo)向串講Web開發(fā)中的知識點。為什么我們摒棄了傳統(tǒng)的知識點講解方法，就是為了能夠培養(yǎng)學(xué)生的編程興趣，達到自主學(xué)習(xí)的目的。我們發(fā)現(xiàn)人們玩游戲的興趣遠比去學(xué)習(xí)一堆枯燥的代碼要大得多，這是因為玩游戲是一個自我挑戰(zhàn)的過程，一個好玩的游戲有精準的難度設(shè)計、炫酷的視覺感受，恰當好處地勾起你挑戰(zhàn)下一關(guān)的欲望。所以我們在想，為什么不可以像設(shè)計游戲一樣去設(shè)計一本書。

單元1，先告訴你什么是響應(yīng)式設(shè)計以及HTML5和CSS3。本章要求很簡單，照著代碼敲出兩個項目，看HTML5和CSS3能夠做出什么。相信你一定可以做到，并且感興趣。

單元2，主打文字主題，在這里需要挑戰(zhàn)3個項目——電子雜志、唯美軟文和手機版的導(dǎo)航。每個挑戰(zhàn)項目都會有“指南”，如項目介紹、前導(dǎo)知識，并且每個項目都有很多注釋的內(nèi)容，幫助讀者解讀關(guān)鍵性代碼。

單元3，主打圖文主題，這里也需要挑戰(zhàn)3個項目——書城、多肉植物和會晃動的桃子，技術(shù)上包括了CSS3的陰影、圓角和動畫效果等。

單元 4，表單。它可以說是 HTML5 最令人振奮的改進之一，幫助開發(fā)人員省去了大段的JavaScript驗證代碼。通過第4單元的兩個項目，你可以充分地感受到HTML5帶給前端開發(fā)人員的便捷。

單元5，畫布。它是HTML5新加的元素。本單元有兩個特別好玩的項目——網(wǎng)頁涂鴉板和紅包照片。

單元6，音頻和視頻。如果讀者是一個愛聽音樂愛看電影的年輕人。那么在這個單元，可以定制一個屬于自己的視頻播放器和音頻播放器。

單元7，我們將迎來里程碑式的內(nèi)容——響應(yīng)式Web設(shè)計原理。本單元會有2個項目，帶領(lǐng)讀者第一次完成響應(yīng)式項目?？粗约褐谱鞯木W(wǎng)頁會在各種設(shè)備的屏幕上任意切換，一定很有成就感。

單元8，Bootstrap響應(yīng)式Web開發(fā)實戰(zhàn)。Bootstrap是響應(yīng)式Web開發(fā)神器，本單元通過1個完整的項目，讓你快速地搭建響應(yīng)式網(wǎng)站。

為了保證讀者學(xué)習(xí)的全面性，我們在全書的最后制作了豐富的附錄，內(nèi)容包括HTML5新增標簽、HTML5廢除標簽、CSS3新增屬性和需要加瀏覽器私有前綴的屬性等。

致謝

本教材的編寫和整理工作由傳智播客教育科技股份有限公司完成，主要參與人員有呂春林、馬丹、金鑫、王玉華、馬倫、劉曉強、趙玉川、周淑剛、汪磊等，全體人員在這近一年的編寫過程中付出了很多辛勤的汗水，在此一并表示衷心的感謝。

意見反饋

盡管我們盡了最大的努力，但教材中難免會有不妥之處，歡迎各界專家和讀者朋友們來信來函給予寶貴意見，我們將不勝感激。您在閱讀本書時，如發(fā)現(xiàn)任何問題或有不認同之處可以通過電子郵件與我們?nèi)〉寐?lián)系。

請發(fā)送電子郵件至itcast_book@vip.sina.com。

黑馬程序員

2016-9-8于北京