網(wǎng)頁設(shè)計(jì)與制作實(shí)例教程(HTML+CSS+JavaScript)
定 價(jià):29.8 元
叢書名:“十三五”高等職業(yè)教育計(jì)算機(jī)類專業(yè)規(guī)劃教材
- 作者:馮淑杰,孫榮俠 著
- 出版時(shí)間:2018/8/1
- ISBN:9787113246426
- 出 版 社:中國鐵道出版社
- 中圖法分類:TP393.092.2
- 頁碼:164
- 紙張:膠版紙
- 版次:1
- 開本:16開
本書以HTML、CSS和JavaScript為知識主線,以實(shí)例的形式介紹了網(wǎng)頁設(shè)計(jì)的相關(guān)知識。全書共六個(gè)項(xiàng)目,內(nèi)容涵蓋網(wǎng)站策劃、HTML基礎(chǔ)語法、網(wǎng)頁布局、網(wǎng)頁內(nèi)容編輯、網(wǎng)頁特效、綜合實(shí)訓(xùn)。
本書以學(xué)習(xí)者為中心,不僅強(qiáng)調(diào)基本技能的訓(xùn)練、基礎(chǔ)知識的學(xué)習(xí),還注重能力的培養(yǎng)。書中收集了大量實(shí)例,通過從分析到制作的流程編排,終形成項(xiàng)目、任務(wù)驅(qū)動(dòng)的實(shí)例教程。
本書適合作為職業(yè)院校培養(yǎng)前端工程師崗位能力的入門教材,也可以作為網(wǎng)頁制作人員的自學(xué)用書。
在“互聯(lián)網(wǎng)+”時(shí)代,各種網(wǎng)站的需求越來越多,規(guī)范性標(biāo)準(zhǔn)越來越高,技術(shù)越來越先進(jìn)。傳統(tǒng)的網(wǎng)站制作教材從技術(shù)實(shí)現(xiàn)的角度來看,使用的技術(shù)比較落后;從代碼結(jié)構(gòu)來看,沒有將頁面內(nèi)容和樣式進(jìn)行分離,導(dǎo)致代碼過于繁瑣,不便于學(xué)習(xí)者閱讀。
為適應(yīng)現(xiàn)代技術(shù)的飛速發(fā)展,幫助眾多喜愛網(wǎng)站開發(fā)的人員學(xué)習(xí)標(biāo)準(zhǔn)的網(wǎng)頁設(shè)計(jì)規(guī)范、提高網(wǎng)站的設(shè)計(jì)及編碼水平,編者根據(jù)多年的教學(xué)經(jīng)驗(yàn)和學(xué)生的認(rèn)知規(guī)律,在潛心研讀網(wǎng)站制作的前沿技術(shù)之后,由眾多教師經(jīng)過多次討論、多次修改之后精心編寫了本書。本書既可作為應(yīng)用型本科、高職院校、成人繼續(xù)教育的教材,也可作為網(wǎng)頁開發(fā)人員的自學(xué)或參考用書。
本書主要有以下特點(diǎn)。
1.立足精品導(dǎo)向、能力引領(lǐng)
全書的編寫始終秉承精品意識,以國家級精品教材標(biāo)準(zhǔn)為目標(biāo)導(dǎo)向,并借鑒眾多同類教材的編寫經(jīng)驗(yàn),在內(nèi)容上兼顧知識的基礎(chǔ)性和前沿性、網(wǎng)頁的創(chuàng)意性和技術(shù)實(shí)用性以及大學(xué)教學(xué)的學(xué)術(shù)性;在編寫思想上遵守“授人以魚不如授人以漁”的原則,重在能力的提高,而非知識的灌輸,幫助讀者快速提升網(wǎng)頁設(shè)計(jì)技術(shù)和實(shí)際應(yīng)用能力。
2.內(nèi)容系統(tǒng)完整、重點(diǎn)突出
Web前端開發(fā)的教學(xué)主要有兩項(xiàng)任務(wù),即傳授知識和培養(yǎng)興趣。教學(xué)成功的關(guān)鍵是在這兩方面尋找一個(gè)折中。如果上課講授的知識點(diǎn)過多過細(xì),學(xué)生思考和實(shí)踐的環(huán)節(jié)就會減少;如果講授的知識點(diǎn)過少,片面強(qiáng)調(diào)讓學(xué)生實(shí)踐,學(xué)生由于知識點(diǎn)沒理清,又容易陷入低水平的盲目實(shí)踐。
為此,本書在編寫時(shí),注重培養(yǎng)學(xué)生興趣。從結(jié)構(gòu)上分為三個(gè)部分,包括HTML標(biāo)簽學(xué)習(xí)、CSS樣式設(shè)計(jì)以及JS(JavaScript)網(wǎng)頁交互設(shè)計(jì),注重培養(yǎng)學(xué)生興趣。在內(nèi)容編排上通過六個(gè)項(xiàng)目來完成知識學(xué)習(xí),將CSS知識的學(xué)習(xí)作為重點(diǎn),因?yàn)橹挥薪佑|到CSS,學(xué)生才會領(lǐng)會到這門課程的樂趣。內(nèi)容涵蓋網(wǎng)站策劃、HTML基礎(chǔ)語法、網(wǎng)頁布局、網(wǎng)頁內(nèi)容編輯、網(wǎng)頁特效、綜合實(shí)訓(xùn)。
3.講述通俗簡潔、條理清晰
本書面向初學(xué)者,從零基礎(chǔ)講起,并迅速追蹤到前沿技術(shù)?紤]到目前大多數(shù)院校課時(shí)壓縮、強(qiáng)調(diào)學(xué)生自學(xué)能力培養(yǎng)的實(shí)際情況,本書的編寫力求做到深入淺出、通俗易懂、表述簡潔、條理清晰。本書對基礎(chǔ)知識、基本技術(shù)技能和設(shè)計(jì)原理的講述比較細(xì)致,在難懂的地方一般補(bǔ)充了圖表、示例說明;所用程序、結(jié)構(gòu)層次清晰,對關(guān)鍵代碼給出了詳細(xì)的注釋,具有可讀性和可理解性;全書力求避免大量的純文字性、抽象描述,避免空洞、無內(nèi)容。本書各章內(nèi)容結(jié)構(gòu)清晰,內(nèi)容之間聯(lián)系緊湊、自然,難度循序漸進(jìn)、邏輯性強(qiáng)。
4.案例引導(dǎo)、示例輔助、圖文并茂
本書的教學(xué)大概需要72學(xué)時(shí),帶“*”號的章節(jié)建議學(xué)生自學(xué)。在知識編排上,項(xiàng)目2和項(xiàng)目3為基礎(chǔ),主要講解了HTML標(biāo)簽,CSS樣式的基本語法與用法。項(xiàng)目4為重點(diǎn),講解了代碼的具體應(yīng)用,課時(shí)具體安排如下:
課時(shí)安排表
內(nèi) 容 課 時(shí)
項(xiàng)目一 網(wǎng)站策劃 2
項(xiàng)目二 HTML基礎(chǔ)語法 6
項(xiàng)目三 網(wǎng)頁布局 16
項(xiàng)目四 網(wǎng)頁內(nèi)容編輯 28
項(xiàng)目五 網(wǎng)頁特效 10
項(xiàng)目六 綜合實(shí)例 10
小計(jì) 72
考慮到大多數(shù)技術(shù)或代碼比較抽象、難懂,在講述時(shí)都輔之以精心設(shè)計(jì)的典型實(shí)例,通過具體示例來說明相關(guān)技術(shù)的使用技巧,并運(yùn)用工具軟件詳細(xì)地說明操作步驟,以此實(shí)現(xiàn)講述的簡潔性、通俗易懂性。同時(shí)將各種技術(shù)的應(yīng)用效果都用圖片方式展示出來,做到圖文并茂、形象直觀。在編寫上,總體遵循案例引導(dǎo)、示例輔助,從具體例子到抽象概念再到復(fù)雜技術(shù)的敘述方法。所有示例都經(jīng)過上機(jī)測試,確保運(yùn)行結(jié)果準(zhǔn)確無誤,讀者可以直接在瀏覽器中打開該文件查看運(yùn)行效果,并通過對實(shí)例代碼的理解、模仿和改進(jìn),將所學(xué)用到實(shí)際項(xiàng)目中,做到即學(xué)即用。
本書由馮淑杰、孫榮俠任主編,竇立莉、雷妍、趙姝菊、劉輝任副主編。具體分工為馮淑杰負(fù)責(zé)全書的架構(gòu)制定、統(tǒng)稿和項(xiàng)目3的編寫工作,孫榮俠參與全書的架構(gòu)制定并負(fù)責(zé)項(xiàng)目2的編寫工作,竇立莉負(fù)責(zé)項(xiàng)目1的編寫工作,雷妍負(fù)責(zé)項(xiàng)目4(任務(wù)4.1至任務(wù)4.3)的部分編寫工作,趙姝菊負(fù)責(zé)項(xiàng)目6的編寫工作,劉輝負(fù)責(zé)項(xiàng)目5和項(xiàng)目2(任務(wù)2.5)、項(xiàng)目4(任務(wù)4.4)的編寫工作,李煦、王曉旭主要參與各任務(wù)的實(shí)驗(yàn)素材編輯工作。
編寫過程中編者始終以“求真務(wù)實(shí)、盡善盡美”要求自己,不僅在編寫前做了充分的準(zhǔn)備,而且書稿幾經(jīng)修改、潤色。盡管編者在編寫過程中力求做到準(zhǔn)確無誤,但由于水平有限,不足和疏漏之處在所難免,懇請讀者不吝賜教。
編 者
馮淑杰,女,天津?yàn)I海職業(yè)學(xué)院計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)專業(yè)帶頭人。2002年7月畢業(yè)于牡丹江師范學(xué)院計(jì)算機(jī)系,獲學(xué)士學(xué)位,2007年9月畢業(yè)于天津大學(xué)計(jì)算機(jī)學(xué)院,獲高校教師碩士學(xué)位,網(wǎng)絡(luò)設(shè)備調(diào)試員技師,雙師型教師,F(xiàn)主要從事計(jì)算機(jī)網(wǎng)絡(luò)的教學(xué)工作,承擔(dān)的主要課程有《網(wǎng)頁設(shè)》《flash動(dòng)畫制作》,《網(wǎng)站界面設(shè)計(jì)》,《網(wǎng)站建設(shè)實(shí)訓(xùn)》等。
孫榮俠,天津?yàn)I海職業(yè)學(xué)院副教授。1996年本科畢業(yè),所學(xué)專業(yè)是計(jì)算機(jī)及其應(yīng)用,2005年獲得在職教育碩士。多年來講授過《C語言程序設(shè)計(jì)》《數(shù)據(jù)結(jié)構(gòu)》《操作系統(tǒng)》《網(wǎng)頁設(shè)計(jì)》《ASP.NET(C#)》《網(wǎng)站建設(shè)與管理》等課程。目前主要研究方向是網(wǎng)站構(gòu)建。主持過精品課,主持參與過校級課題、市級課題,在各類雜志上發(fā)表過多篇論文,獲得各種技能證書及其獎(jiǎng)項(xiàng)。
項(xiàng)目一 網(wǎng)站策劃 1
任務(wù)1.1 了解網(wǎng)站開發(fā)流程 1
任務(wù)1.2 使用Dreamweaver建立站點(diǎn) 6
任務(wù)1.3 網(wǎng)頁文檔基本操作 12
課后練習(xí) 18
項(xiàng)目二 HTML基礎(chǔ)語法 19
任務(wù)2.1 使用HTML創(chuàng)建一個(gè)空白頁 19
任務(wù)2.2 創(chuàng)建一個(gè)新聞網(wǎng)頁 21
任務(wù)2.3 列表 28
任務(wù)2.4 表格 32
任務(wù)2.5 表單在網(wǎng)頁中的應(yīng)用 36
課后練習(xí) 45
項(xiàng)目三 網(wǎng)頁布局 46
任務(wù)3.1 使用CSS樣式表給網(wǎng)頁排版 46
任務(wù)3.2 使用盒子進(jìn)行CSS標(biāo)準(zhǔn)流布局 57
任務(wù)3.3 采用CSS浮動(dòng)屬性進(jìn)行網(wǎng)頁布局 72
任務(wù)3.4 采用定位屬性進(jìn)行網(wǎng)頁布局 80
*任務(wù)3.5 采用彈性盒子布局響應(yīng)式頁面 86
課后練習(xí) 94
項(xiàng)目四 網(wǎng)頁內(nèi)容編輯 95
任務(wù)4.1 使用CSS編輯網(wǎng)頁中的文字 95
任務(wù)4.2 使用CSS編輯圖像 105
任務(wù)4.3 使用CSS編輯導(dǎo)航欄 113
任務(wù)4.4 使用CSS美化表單 119
課后練習(xí) 122
項(xiàng)目五 網(wǎng)頁特效 124
任務(wù)5.1 使用JavaScript實(shí)現(xiàn)網(wǎng)頁 124
任務(wù)5.2 制作樹形菜單 126
任務(wù)5.3 制作頁面Tab選項(xiàng)卡切換效果 129
*任務(wù)5.4 制作圖片跑馬燈效果 132
課后練習(xí) 135
項(xiàng)目六 綜合實(shí)例 136
任務(wù)6.1 模板在網(wǎng)站中的應(yīng)用 136
任務(wù)6.2 金蘋果幼兒園網(wǎng)站的制作 145
課后練習(xí) 155
參考文獻(xiàn) 156