Web前端開發(fā)配套資源PPT2、課程教學(xué)大綱-web前端開發(fā)技術(shù)

《Web前端開發(fā)技術(shù)》教學(xué)大綱SyllabusofWebFront-EndDevelopmentTechnology課程基本信息CourseInformation課程名稱CourseNameWeb前端開發(fā)技術(shù)開課學(xué)院（部）SchoolWebFront-EndDevelopmentTechnology課程編碼CourseCode課程類別CourseType專業(yè)課學(xué)分Credits課內(nèi)學(xué)時CourseHours80理論學(xué)時LectureHours60實踐學(xué)時PracticeHours0實驗/上機學(xué)時Experiment/ProgrammingHours20課外/線上學(xué)時Home/OnlineHours0授課語言LanguageofInstruction中文適用專業(yè)Audience計算機科學(xué)與技術(shù)、軟件工程先修課程Prerequisite程序設(shè)計基礎(chǔ)課程簡介CourseDescription課程性質(zhì)：本課程是計算機科學(xué)與技術(shù)專業(yè)、軟件工程專業(yè)開設(shè)的一門實踐性很強的專業(yè)必修應(yīng)用課程。主要教學(xué)內(nèi)容：本課程講授web前端開發(fā)三大主流技術(shù)（HTML5、CSS3和JavaScript腳本語言編程）的相關(guān)知識。第一部分是HTML技術(shù)，介紹了Web開發(fā)的基本概念、設(shè)計工具、運行環(huán)境、布局技術(shù)基礎(chǔ)、常用HTML標(biāo)記和應(yīng)用實例；第二部分是CSS技術(shù)，介紹了CSS3的樣式規(guī)則、盒模型、選擇符、常用CSS樣式及應(yīng)用實例；第三部分是JavaScript技術(shù)，介紹了JavaScript技術(shù)的編程基礎(chǔ)，包括數(shù)據(jù)類型、變量、數(shù)組、語句、函數(shù)、內(nèi)置對象、DOM對象、BOM對象和應(yīng)用實例；第四部分是jQuery技術(shù)，介紹了jQuery技術(shù)的語法規(guī)則、選擇元素對象、操作元素對象的方法和實例，以及AJAX的概念及應(yīng)用。課程教學(xué)目標(biāo)：通過本課程的學(xué)習(xí)，熟練Web前端開發(fā)流程及三大技術(shù)，具備Web前端網(wǎng)頁和交互式效果開發(fā)的基礎(chǔ)能力。課程教學(xué)大綱CourseSyllabus課程目標(biāo)LearningOutcomes通過本課程的學(xué)習(xí)，培養(yǎng)前端開發(fā)技術(shù)人才，樹立Web系統(tǒng)開發(fā)的概念，為學(xué)習(xí)后續(xù)專業(yè)課程動態(tài)網(wǎng)頁設(shè)計打下堅實的理論和實踐基礎(chǔ)。1．價值目標(biāo)（或稱育人目標(biāo)）：前端開發(fā)技術(shù)人才2．知識、能力和素質(zhì)目標(biāo)：2.1掌握Web前端的基本概念、基本理論和基本方法2.2能夠?qū)崿F(xiàn)Web前端網(wǎng)頁設(shè)計教學(xué)內(nèi)容、教學(xué)進度及要求Topics、ClassSchedule&Requirements章節(jié)或知識模塊內(nèi)容學(xué)時作業(yè)要求第1章Web概述1.1Web的概念 1.2Web前端設(shè)計基礎(chǔ)1.3Web系統(tǒng)開發(fā)流程 2第1章思考和實踐第2章HTML技術(shù)基礎(chǔ)2.1HTML概念2.2HTML標(biāo)記的語法2.3HTML文件2.4HTML標(biāo)記的全局屬性 2第2章思考和實踐第3章HTML文本類標(biāo)記3.1文本排版標(biāo)記 3.2列表標(biāo)記4第3章思考和實踐第4章HTML多媒體類標(biāo)記4.1多媒體文件 4.2多媒體類標(biāo)記2第4章思考和實踐第5章HTML超鏈接類標(biāo)記5.1超鏈接概念5.2超鏈接類標(biāo)記 2第5章思考和實踐第6章HTML表單類標(biāo)記6.1表單概述 6.2表單基本元素標(biāo)記 6.3表單高級元素標(biāo)記4第6章思考和實踐第7章HTML表格和結(jié)構(gòu)類標(biāo)記7.1表格類標(biāo)記7.2表格嵌套 7.3HTML的結(jié)構(gòu)類標(biāo)記2第7章思考和實踐第8章CSS技術(shù)基礎(chǔ)8.1CSS的定義8.2CSS的語法基礎(chǔ) 8.3CSS選擇符4第8章思考和實踐第9章CSS盒子及邊框樣式9.1CSS盒模型9.2盒子的大小9.3盒子的邊框樣式9.4盒子陰影樣式2第9章思考和實踐第10章CSS盒子的定位布局樣式10.1CSS定位樣式10.2CSS多列布局樣式2第10章思考和實踐第11章CSS盒子背景樣式11.1不透明度樣式11.2背景顏色樣式11.3背景圖片樣式11.4背景復(fù)合樣式background11.5背景漸變樣式值4第11章思考和實踐第12章CSS文本段落樣式12.1文本字形12.2文本修飾 12.3文本排版2第12章思考和實踐第13章CSS其它元素樣式13.1圖片樣式13.2表格樣式13.3超鏈接和鼠標(biāo)樣式13.4列表樣式2第13章思考和實踐第14章CSS動畫設(shè)計14.1CSS變形14.2CSS過渡14.3CSS關(guān)鍵幀動畫2第14章思考和實踐第15章JavaScript技術(shù)基礎(chǔ)15.1JavaScript簡介15.2JavaScript的使用方式15.3JavaScript編程基礎(chǔ)15.4JavaScript數(shù)據(jù)與運算符2第15章思考和實踐第16章JavaScript語句和函數(shù)16.1條件語句16.2循環(huán)語句16.3函數(shù)2第16章思考和實踐第17章JavaScript內(nèi)置對象17.1對象的概念17.2Global對象17.3Number對象17.4Math對象17.5String對象17.6RegExp對象17.7Array對象17.8Date對象6第17章思考和實踐第18章JavaScriptDOM和BOM對象18.1文檔對象模型DOM18.2瀏覽器對象模型BOM4第18章思考和實踐第19章jQuery技術(shù)基礎(chǔ)19.1jQuery語法基礎(chǔ)19.2jQuery選擇元素對象4第19章思考和實踐第20章jQuery操作方法及應(yīng)用20.1獲取元素對象信息20.2設(shè)置元素對象信息20.3設(shè)置元素對象事件20.4操作文檔結(jié)構(gòu) 20.5jQuery特效4第20章思考和實踐第21章AJAX技術(shù)21.1AJAX基礎(chǔ)21.2AJAX的應(yīng)用2第21章思考和實踐考核內(nèi)容、方式及評分標(biāo)準(zhǔn)ContentsandMethodofAssessment,GradingStandards考核環(huán)節(jié)總成績占比實驗1、本課程20個學(xué)時實驗。2、成績采用百分制，根據(jù)設(shè)計完成情況評分40%期末考試1、開卷考試，成績采用百分制，卷面成績總分100分。2、主要考核學(xué)生對前端技術(shù)基本知識的掌握能力，學(xué)生綜合運用所學(xué)知識完成綜合網(wǎng)頁設(shè)計。60%考核環(huán)節(jié)評分標(biāo)準(zhǔn)<6060-7575-9090-100實驗作業(yè)抄襲，未能按時完成，設(shè)計效果不符合要求獨立思考、按時完成，設(shè)計效果基本符合要求獨立思考、按時完成，設(shè)計效果完全符合要求獨立思考、按時完成，設(shè)計效果完全符合要求，并有自創(chuàng)設(shè)計效果教材及參考資料Textbook&Resources教材：《web前端開發(fā)技術(shù)（HTML5+CSS3+Javascript+jQuery）》劉均編著，清華大學(xué)出版社，2022年1月，第1版參考資料：【1】《網(wǎng)頁設(shè)計與Web前端開發(fā)案例教程——HTML5、CSS3、JavaScript微課視頻版》，莫小梅主編，清華大學(xué)出版社，2019年8月，第1版【2】《網(wǎng)頁設(shè)計與制作》朱金華，胡秋芬，劉均等編，機械工業(yè)出版社，2018年9月，第1版附表：實驗安排序號實驗項目名稱實驗內(nèi)容實驗性質(zhì)實驗類型1HTML標(biāo)記應(yīng)用用HTML標(biāo)記設(shè)計網(wǎng)頁必做設(shè)計性2CSS樣式應(yīng)用用CSS修飾網(wǎng)頁必做設(shè)計性3JS基本程序應(yīng)用設(shè)計條件語句和循環(huán)語句應(yīng)用必做設(shè)計性4Number和Math對象應(yīng)用設(shè)計網(wǎng)頁，用JS處理全局對象數(shù)據(jù)必做設(shè)計性5String對象應(yīng)用設(shè)計網(wǎng)頁，用JS處理String對象數(shù)據(jù)必做設(shè)計性6Array對象應(yīng)用設(shè)計網(wǎng)頁