HTML5+CSS3網(wǎng)頁設(shè)計(jì)任務(wù)教程（第2版）授課計(jì)劃

XXXXXX職業(yè)技術(shù)學(xué)院課程授課計(jì)劃（202X/202X年第X學(xué)期）課程名稱（全稱）WEB開發(fā)基礎(chǔ)授課班級(jí)軟件23XXX課程總學(xué)時(shí)64本學(xué)期計(jì)劃學(xué)時(shí)64任課教師XXXXXXXX教研室XXXX教研室制定日期202X年X月XX日

課程標(biāo)準(zhǔn)制定部門XXXXXX學(xué)院教材全稱（編者、出版單位、出版時(shí)間）《HTML5+CSS3網(wǎng)頁設(shè)計(jì)任務(wù)教材（第2版）》（湯佳陳曉男主編，高等教育出版社，2023年12月）主要教學(xué)參考書（名稱、編者）《HTML5+CSS3+JavaScript從入門到精通（標(biāo)準(zhǔn)版）》（未來科技主編、中國水利水電出版社、2017年07月）本學(xué)期教學(xué)周數(shù)16本課程周時(shí)數(shù)4本課程學(xué)期總時(shí)數(shù)64編制說明：1、本課程以幫助通過程序員考試為目標(biāo)，將理論學(xué)習(xí)融入于任務(wù)完成過程中，并以理論考核情況以及實(shí)驗(yàn)完成情況作為評(píng)定學(xué)生課程成績(jī)的主要依據(jù)。2、“周次”（1-16）不是實(shí)際周次而是相對(duì)周次。3、講授和現(xiàn)場(chǎng)教學(xué)均采用理實(shí)一體化的教學(xué)組織形式，講練結(jié)合，安排在機(jī)房教學(xué)。教學(xué)方式與課時(shí)分配講授（一體化）5實(shí)踐43討論習(xí)題課現(xiàn)場(chǎng)教學(xué)（一體化）16復(fù)習(xí)測(cè)驗(yàn)機(jī)動(dòng)本課程考核方式性質(zhì)：考試考核形式：項(xiàng)目設(shè)計(jì)教研室主任系主任教務(wù)處長(zhǎng)教務(wù)院長(zhǎng)序號(hào)周次學(xué)時(shí)教學(xué)章節(jié)及內(nèi)容摘要教學(xué)方式作業(yè)布置112單元1HTML5靜態(tài)網(wǎng)站開發(fā)概述1.1常用HTML5開發(fā)環(huán)境的搭建1.2完成第一個(gè)HTML5頁面單元2HTML5中常用標(biāo)簽的使用2.1使用<marquee>標(biāo)簽制作滾動(dòng)字幕2.2使用<a>標(biāo)簽實(shí)現(xiàn)超鏈接2.3使用<a>標(biāo)簽實(shí)現(xiàn)錨點(diǎn)鏈接現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻，完成單元1作業(yè)及測(cè)試212單元2HTML5中常用標(biāo)簽的使用2.4使用文本類標(biāo)簽實(shí)現(xiàn)文本的顯示2.5使用文本格式類屬性實(shí)現(xiàn)文本的特殊顯示效果2.6使用轉(zhuǎn)義字符顯示特殊符號(hào)現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻322單元2HTML5中常用標(biāo)簽的使用2.7使用圖像類標(biāo)簽顯示圖像及圖像映射2.8<iframe>標(biāo)簽的使用2.9多媒體標(biāo)簽的使用現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻422單元2HTML5中常用標(biāo)簽的使用2.10表單的簡(jiǎn)單應(yīng)用2.11表單格式驗(yàn)證現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻，完成單元2作業(yè)及測(cè)試532單元3CSS基本應(yīng)用3.1使用CSS設(shè)置body樣式3.2CSS元素選擇器的使用現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻632單元3CSS基本應(yīng)用3.3內(nèi)聯(lián)式、嵌入式、外部式樣式的使用3.4測(cè)試樣式優(yōu)先級(jí)3.5創(chuàng)建盒子模型3.6CSS中float屬性的使用現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻742單元3CSS基本應(yīng)用3.6CSS中float屬性的使用3.7常用文本樣式屬性的使用3.8常用圖片樣式屬性的使用現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻842單元3CSS基本應(yīng)用3.9position的4種定位方式的使用3.10Chrome瀏覽器調(diào)試基本技巧現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻，完成單元3作業(yè)及測(cè)試952單元4CSS3高級(jí)應(yīng)用4.1FontAwesome圖標(biāo)的使用4.2CSS3圖片背景的使用4.3制作搜索框現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻1052單元4CSS3高級(jí)應(yīng)用4.4制作無間隙滾動(dòng)文字和圖片現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻1162單元4CSS3高級(jí)應(yīng)用4.5制作輪播文字和圖片實(shí)踐在線學(xué)習(xí)視頻1262單元4CSS3高級(jí)應(yīng)用4.6制作多種文字特效4.7制作圖片遮罩和懸停特效實(shí)踐在線學(xué)習(xí)視頻，完成單元4作業(yè)及測(cè)試1372單元5頁面局部布局5.1圖文混排與文字溢出5.2中英文混合標(biāo)題講授（一體化）+實(shí)踐在線學(xué)習(xí)視頻1472單元5頁面局部布局5.3閱讀更多內(nèi)容5.4制作文字選項(xiàng)卡與圖片選項(xiàng)卡講授（一體化）+實(shí)踐在線學(xué)習(xí)視頻1582單元5頁面局部布局5.5制作內(nèi)容折疊與菜單折疊實(shí)踐在線學(xué)習(xí)視頻1682單元5頁面局部布局5.6制作導(dǎo)航條單元8HTML5綜合案例8.1靜態(tài)網(wǎng)頁開發(fā)的基本流程8.2期末大作業(yè)講授（一體化）+實(shí)踐在線學(xué)習(xí)視頻1792單元5頁面局部布局5.7制作文字列表、圖文混排列表和縮略圖列表現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)需求分析1892單元5頁面局部布局5.8制作登錄界面5.9制作評(píng)論區(qū)實(shí)踐在線學(xué)習(xí)視頻，完成單元5作業(yè)及測(cè)試、期末項(xiàng)目設(shè)計(jì)素材收集19102單元6頁面整體布局6.1960網(wǎng)格系統(tǒng)在網(wǎng)頁制作中的使用6.2clearfix和clear的使用講授（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)搭建頁面框架20102單元6頁面整體布局6.3常用經(jīng)典布局6.4常用彈性布局講授（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)搭建頁面框架21112單元6頁面整體布局6.5表格基本知識(shí)現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)搭建頁面框架22112單元6頁面整體布局6.6使用表格制作個(gè)人簡(jiǎn)歷現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)搭建頁面框架23122單元6頁面整體布局6.7使用表格制作QQ郵箱現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容24122單元6頁面整體布局6.8頭部和banner制作6.8底部導(dǎo)航制作6.8主頁面菜單制作現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容25132單元6頁面整體布局6.8index.html列表制作6.8author.html列表制作實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容26132單元6頁面整體布局6.8book.html列表制作6.8logon.html列表制作實(shí)踐在線學(xué)習(xí)視頻，完成單元6作業(yè)及測(cè)試、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容27142單元7Bootstrap5框架簡(jiǎn)介7.1Bootstrap5基礎(chǔ)知識(shí)7.2制作柵格化布局頁面7.3制作響應(yīng)式導(dǎo)航欄現(xiàn)場(chǎng)教學(xué)（一體化）+實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容28142單元7Bootstrap5框架簡(jiǎn)介7.4制作響應(yīng)式輪播圖7.5制作響應(yīng)式文字和圖片實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容29152單元7Bootstrap5框架簡(jiǎn)介7.6響應(yīng)式框架實(shí)踐在線學(xué)習(xí)視頻、期末項(xiàng)目設(shè)計(jì)制作頁面內(nèi)容30152單元7Bootstrap5框架簡(jiǎn)介7.6頭部背景圖像及菜單7.6banner