《前端Web開發(fā)基礎(chǔ)》課程標準

1、前端Web開發(fā)基礎(chǔ)課程標準表1課程基本信息課程類別專業(yè)課總學時64（理論:實驗：32）學分3開設(shè)學期第九學期適用專業(yè)“3+4”分段培養(yǎng)計算機應(yīng)用技術(shù)（中職）與軟件工程（本科）專業(yè)授課方式理論+實驗執(zhí)筆人審核人制定時間2015.01（一）課程性質(zhì)與任務(wù)課程性質(zhì)：Web開發(fā)基礎(chǔ)是軟件工程專業(yè)培養(yǎng)課程體系中的一門專業(yè)必修課程，其包含了軟件行業(yè)Web開發(fā)領(lǐng)域的關(guān)鍵技術(shù)基礎(chǔ)知識（HTML，CSS及JavaScript等）。該課程的設(shè)置充分考慮了其在Web開發(fā)領(lǐng)域的關(guān)鍵性作用、目前市場廣泛的應(yīng)用需求和良好的就業(yè)前景，注重學生對理論基礎(chǔ)知識、專業(yè)技能的理解、掌握。課程任務(wù)：通過本課程的學習，使學生理解HTM

2、L、CSS及JavaScript等基本的理論知識；掌握應(yīng)用上述理論知識，制作基本網(wǎng)頁、設(shè)計網(wǎng)頁布局、實現(xiàn)多樣化及良好客戶體驗的頁面效果等應(yīng)用技能；培養(yǎng)學生的創(chuàng)新意識，設(shè)計特色網(wǎng)頁。（二）課程教學目標通過本課程的學習，使學生掌握Web開發(fā)技術(shù)的基本理論知識，具備一定的應(yīng)用開發(fā)技能，培養(yǎng)學生工程意識、創(chuàng)新能力和素質(zhì)。知識目標（1）了解本課程內(nèi)容在Web開發(fā)領(lǐng)域的定位與作用；（2）了解HTML、CSS及JavaScript技術(shù)的發(fā)展脈絡(luò)、趨勢及應(yīng)用前景；（3）掌握HTML中的基本元素、文字與段落元素、圖像元素、列表元素、表格元素、超鏈接元素、多媒體元素、框架元素及表單元素的語法、屬性和參數(shù)等基礎(chǔ)知識

3、；（4）掌握CSS中元素的語法、屬性和參數(shù)等基礎(chǔ)知識；（5）了解網(wǎng)頁布局的幾種方法，掌握使用CSS進行網(wǎng)頁布局、樣式設(shè)計的基礎(chǔ)知識；（6）掌握JavaScript中的基本語法知識；（7）掌握JavaScript進行提交內(nèi)容校驗、生成網(wǎng)頁特效等方法。能力目標（1）具備使用HTML制作包含基本內(nèi)容的網(wǎng)頁的能力;（2）具備使用HTML及CSS等技術(shù)來設(shè)計網(wǎng)頁布局的能力；（3）具備使用JavaScript技術(shù)來提高網(wǎng)頁交互性、體驗性的能力；（4）具備綜合使用HTML、CSS與JavaScript的相關(guān)知識，來豐富、渲染網(wǎng)頁的能力；（5）具備根據(jù)具體應(yīng)用需求，創(chuàng)新性地設(shè)計網(wǎng)頁的能力。素質(zhì)目標（1）培養(yǎng)學

4、生具備克服困難解決問題的意志；（2）培養(yǎng)學生養(yǎng)成嚴謹認真的科學態(tài)度，耐心細致的工作作風；（3）培養(yǎng)學生具備良好的交流溝通素養(yǎng)和創(chuàng)新精神。（三）參考學時64（理論：32實驗：32）（四）課程學分4學分（五）課程內(nèi)容和要求（理論48學時，實驗16學時）本課程的主要內(nèi)容有：HTML，主要包括網(wǎng)頁基本組成元素，網(wǎng)頁框架、超文本鏈接、表單、表格、層等。CSS，產(chǎn)要包括修改網(wǎng)頁元素，主要包括修改文字顏色及背景、調(diào)整字符間距、單詞間距、添加文字修飾、設(shè)置文本排列方式、設(shè)置段落縮進、調(diào)整行高、轉(zhuǎn)換英文大小寫、設(shè)置顏色、設(shè)置背景顏色、插入背景圖片、設(shè)置背景圖片位置、設(shè)計邊框樣式、調(diào)整邊框?qū)挾?、設(shè)置邊框顏色、設(shè)置

5、邊框?qū)傩缘?。JavaScript，包括JavaScript基本語法、基本數(shù)據(jù)類型、運算符、函數(shù)、JavaScript事件分析、圖片和多媒體文件的使用、JavaScript對象的應(yīng)用、瀏覽器內(nèi)部對象、內(nèi)置對象和方法等。本課程要求學生了解web編程技術(shù)的產(chǎn)生和發(fā)展過程，會使用HTML編寫網(wǎng)頁，會用CSS對網(wǎng)頁樣式進行設(shè)計，會使用JavaScript實現(xiàn)一些客戶端的數(shù)據(jù)驗證及網(wǎng)頁特效，達到一般企業(yè)用人標準。表2課程內(nèi)容與學時安排表序號教學項目教學內(nèi)容與教學要求活動設(shè)計建議參考課時（理論+實驗）1.1這就是HTML、CSS、（1）采用理論課講授JavaScript的代碼形式第1章HTML、1.2HTM

6、LCSS、JavaScript（2）布置學生提前預(yù)1CSSkJavaScript各自的角色習，查找資料，課堂講2綜述1.3如何學習HTML、CSS、授中，穿插發(fā)言、討論JavaScript的形式，來進行授課1.4小實例HTML、CSS、JavaScript的1.4綜合應(yīng)用2第2章HTML基礎(chǔ)介紹HTML文檔的結(jié)構(gòu)HTML基本語法HTML文件的命名2.4編寫HTML文件的注意事項(1)采用理論課講授形式(2)布置學生提前預(yù)習，除講授基本知識外，編寫一個HTML簡單文件進行示例講解(1)采用理論課講授形23第3章HTML文件的整體結(jié)構(gòu)3.1文件頭部內(nèi)容3.2主體內(nèi)容Vbody式(2)布置學生提前預(yù)

7、習，除講授基本知識夕卜，給出關(guān)于的程序示例進行講解(1)采用實驗課形式24實驗1制作簡單的HTML頁面使用網(wǎng)頁基本組成元素，編寫一個簡單的HTML頁面，運行查看效果(2)建議布置學生提前復(fù)習所學習的相關(guān)HTML元素的語法、屬性及參數(shù)知識.(1)采用理論課講授形25第4章文字與段落4.1編輯內(nèi)容42文字效果4.3文字修飾4.4段落Vp4.5小實例文字網(wǎng)頁式(2)布置學生提前預(yù)習，除講授基本知識外，給出關(guān)于文字與段落元素的的程序示例進行講解(1)采用理論課講授形式26第5章建立和使用列表5.1列表類型5.2嵌套列表5.3小實例一一列表在網(wǎng)頁中的使用(2)布置學生提前預(yù)習，除講授基本知識外，給出關(guān)于

8、列表的程序示例進行講解(1)采用理論課講授形式27第6章超鏈接6.1超鏈接概述6.2超鏈接的路徑26.3超鏈接的建立6.4設(shè)置圖像映射6.5小實例一一超鏈接的使用(2)布置學生提前預(yù)習，除講授基本知識外，給出超鏈接的程序示例進行講解7.1表格概述7.2插入表格Vtable(1)采用理論課講授形式8應(yīng)用第7章表格的7.3設(shè)置表格標記屬性7.4設(shè)置表格行與單元格7.5表格嵌套(2)布置學生提前預(yù)習，除講授基本知識外，給出表格相關(guān)的程序示例進行講解47.6小實例表格在網(wǎng)(1)采用實驗課形式頁中的應(yīng)用(2)建議布置學生提前復(fù)習/ALLDU-J9實驗2練習使用表格和和列表要求使用表格、列表對數(shù)據(jù)進行格式

9、化的顯示所學習的表格、列表等兀素的語法、屬性及參數(shù)知識(1)采用理論課講授形式28.1圖層的創(chuàng)建一一Vdiv(2丿布置學生提刖預(yù)習,除講授基本知識外，給出圖10用第8章層的應(yīng)8.2創(chuàng)建嵌套圖層8.3層的屬性設(shè)置層相關(guān)的程序示例進行講解38.4小實例圖層的實(1)采用理論課講授形際應(yīng)用式9.1框架概述(2)布置學生提前預(yù)習，9.2框架的基本結(jié)構(gòu)除講授基本知識外，給出框9.3設(shè)置框架架相關(guān)的程序示例進行講解11應(yīng)用第9章框架的9.4設(shè)置框架集Vframeset9.5浮動框架Viframe9.6在框架上建立鏈接9.7小實例框架的實際應(yīng)用(1)采用實驗課形式(2)建議布置學生提前復(fù)習所學習的框架312

10、實驗3練習使用框架練習使用框架，來規(guī)劃、設(shè)計頁面內(nèi)容，包括使用及框架2術(shù)兀素的語法、屬性及參數(shù)知識13第10章表單的應(yīng)用10*1表單概述表單標記Vform信息輸入Vinput10.4小實例表單的實際應(yīng)用(1丿米用埋論課講授形式(2)布置學生提前預(yù)習，除講授基本知識夕卜，給出表單相關(guān)的程序示例進行講解214實驗4練習使用表單練習使用表單，包括其action及method屬性，并練習使用表單中的元素，包括文本框、列表框、文本域、單選框、復(fù)選框和按鈕等內(nèi)容(1)采用實驗課形式(2)建議布置學生提前復(fù)習所學習的表單及表單內(nèi)相關(guān)元素的語法、屬性及參數(shù)知識215第11章CSS樣式表基礎(chǔ)CSS的概述CSS的

11、使用11.3插入CSS樣式表11.4編寫CSS文件(1)采用理論課講授形式(2)布置學生提前預(yù)習，除講授基本知識夕卜，給出使用CSS、編寫簡單CSS的程序示例進行講解216第12章字體的設(shè)置設(shè)置字體font-family設(shè)置字號font-size設(shè)置字體樣式一一font-style設(shè)置字體加粗font-weight設(shè)置字體變體font-variant組合設(shè)置字體屬性一一font12.7小實例一一綜合設(shè)置(1)采用理論課講授形式(2)布置學生提前預(yù)習，除講授基本知識夕卜，給出通過CSS設(shè)置字體相關(guān)的程序示例進行講解2字體17用實驗5練習使寸CSS對字體進行設(shè)置練習使用CSS，在HTML文件里進行

12、調(diào)用，對字體進行設(shè)置，包括了對字體、字號、字體樣式、加粗、字體變體、字體屬性等的設(shè)置(1)采用實驗課形式(2)建議布置學生提前復(fù)習所學習的表單及表單內(nèi)相關(guān)元素的語法、屬性及參數(shù)知識218第13章文本的精細排版13.1調(diào)整字符間距l(xiāng)etterspacing13.2調(diào)整單詞間距wordspacing13.3添加文字修飾textdecoration13.4設(shè)置文本排列方式一13.5設(shè)置段落縮進一一text-indent13.6調(diào)整行高一一line-height13.7轉(zhuǎn)換央文大小與text-transform13.8小實例一一綜合應(yīng)用(1)采用理論課講授形式(2)布置學生提前預(yù)-text-align

13、習，除講授基本知識夕卜，給出CSS對文本進行精密排版相關(guān)的程序示例進行講解219實驗6使用CSS來對文本進行精細排版文本屬性要求編寫CSS文件，在HTML文件里進行調(diào)用，控制DIV顯示效果，練習調(diào)整字符間距、單詞間距、文字修飾、文本排列方式、段落縮進、行高央文大小(1)采用實驗課形式(2)建議布置學生提前復(fù)習所學習的CSS語法知識220第14章圖片和多媒體文件寫等內(nèi)容14.1圖片14.2滾動文字(1)采用理論課講授形式214.3插入多媒體文件一一(2)布置學生提前預(yù)的使用Vembed習，除講授基本知識14.4添加背景音樂一一Vbgsound14.5小實例綜合設(shè)置圖片和多媒體夕卜，給出圖片和多媒

14、體文件相關(guān)的程序示例進行講解21第15章CSS樣式的高級應(yīng)用15.1列表15.2定位15.3CSS層15.4鼠標指針cursor15.5小實例綜合設(shè)置層樣式(1)采用理論課講授形式(2)布置學生提前預(yù)習，除講授基本知識夕卜，給出CSS樣式相關(guān)高級應(yīng)用的程序示例2進行講解22實驗7熟練使用CSS+DIV等元素進行網(wǎng)頁理解網(wǎng)頁布局的幾種方法，重點使用CSS+DIV進行網(wǎng)頁布局設(shè)計(1)采用實驗課形式(2)建議布置學生提前復(fù)習所學習的使用CSS+DIV的網(wǎng)頁布局知2布局設(shè)計16.1設(shè)置顏色color識16.2設(shè)置背景顏色background-color16.3插入背景圖片(1)采用理論課講授back

15、ground-image形式164插入背景附件(2)布置學生提前預(yù)習，除講授基本知識夕卜，給出CSS設(shè)置顏色223第16章顏色和背景丄5F插入背景附附十background-attachment16.5設(shè)置重復(fù)背景圖片一一background-repeat和背景相關(guān)的程序示16.6設(shè)置背景圖片位置一例進行講解background-position167小實例綜合設(shè)置顏色和背景17.1設(shè)計邊框樣式一一(1)采用理論課講授24第17章邊框和邊距border-style17.2調(diào)整邊框?qū)挾纫灰恍问?2)布置學生提前預(yù)2border-width習，除講授基本知識17.3設(shè)置邊框顏色夕卜，給出CSS設(shè)置

16、邊框border-color設(shè)置邊框?qū)傩砸灰籦order邊距一一margin-top/margin-bottom/margin-left/margin-right/margin填充一一padding-top/padding-bottom/padding-left/padding-right/padding17.7小實例一一綜合設(shè)置邊框和邊距和邊距相關(guān)的程序示例進行講解25第18章JavaScript基礎(chǔ)JavaScript語言概況第一個JavaScript程序(1)采用理論課講授形式(2)布置學生提前預(yù)習，除講授基本知識外，設(shè)計一個簡單的JavaScript程序進行講解226第19章JavaS

17、cript基本語法19.1基本數(shù)據(jù)類型19.2運算符19.3程序結(jié)構(gòu)19.4函數(shù)19.5小實例修改密碼(1)采用理論課講授形式(2)布置學生提前預(yù)習，除講授基本知識外，給出相關(guān)的程序示例進行講解(1)采用理論課甲講授形327第20章JavaScript事件分析20.1事件概述20.2主要事件分析20.3其他常用事件式(2)布置學生提前預(yù)習，除講授基本知識外，給出事件相關(guān)的程序示例進行講解(1)采用理論課講授形式328第21章JavaScript對象21.1對象概述21.2瀏覽器內(nèi)部對象2的應(yīng)用21.3內(nèi)置對象和方法（2）布置學生提前預(yù)習，除講授基本知識夕卜，給出JavaScript對象相關(guān)的程

18、序示例進行講解29J實驗8編寫avaScript程序進行頁面驗證要求編寫一個JS程序文件，在另一個文件中對屬性進行賦值，對方法進行引用，能夠進行頁面驗證-等功能（1）采用實驗課形式（2）建議布置學生提前復(fù)習所學習的JavaScript語法知識2（六）教學建議教學方法本門課程教學中應(yīng)注意激發(fā)和保持學生的學習興趣，采用靈活的教學方法和先進的教學手段，加強理論與實際的聯(lián)系，加強課前、課后的答疑輔導(dǎo)，組織學生自我經(jīng)驗敘述、討論、問題教學、閱讀指導(dǎo)等。（1）借助范例教學，以點帶面，突出重點在理論知識講授過程中，應(yīng)適當選取基本點、來提高、鞏固學生對該理論知識的認知水平，可深入到具體的范例場景，加深理解。（2）分組討論式教學方法。學生按照要求，進行預(yù)習、查閱資料等，由各組選派一名同學發(fā)言回答老師所提問題，師及其他各組的同學討論、提問。重點內(nèi)容，對其設(shè)計相關(guān)范例，進行教學，讓學生可以理論結(jié)合實踐，不僅限于紙面，更在課堂上再根據(jù)教師的問題進行分組討論，并并由本組的其他同學補充，講述完畢后，由教評價方法本課程的教學環(huán)節(jié)包括課堂講授，課堂討論和期末考試。通過加強基礎(chǔ)、面向?qū)嶋H、引導(dǎo)思維、啟發(fā)創(chuàng)新，使學生獲得理論知識，培養(yǎng)理論聯(lián)系實際的能力?？傇u成績=