HTML5使用標(biāo)簽創(chuàng)建網(wǎng)頁(yè)結(jié)構(gòu)，設(shè)置CSS屬性完成網(wǎng)頁(yè)布局。120HTML5基礎(chǔ)語(yǔ)法與文檔結(jié)構(gòu)，語(yǔ)義化標(biāo)簽及多媒體元素的應(yīng)用，理解盒子模型和常見(jiàn)布局流技術(shù)，綜合運(yùn)用CSS知識(shí)，提升網(wǎng)頁(yè)布局能力和動(dòng)態(tài)表現(xiàn)效果。24.9表格標(biāo)簽該班人數(shù)M人，年齡約N歲，中技階段，學(xué)習(xí)本課程之前已有一定的計(jì)算機(jī)基礎(chǔ)認(rèn)知，均具備數(shù)年的網(wǎng)齡，對(duì)網(wǎng)頁(yè)相關(guān)概念及技術(shù)有一些簡(jiǎn)單的了解。知識(shí)目標(biāo)：（1）鞏固table標(biāo)簽的使用。（2）單元格colspan屬性、rowspan屬性的應(yīng)用。（3）使用快捷鍵快速構(gòu)建完整的表格。能力目標(biāo)：具備制作常規(guī)個(gè)人簡(jiǎn)歷的布局能力。素養(yǎng)目標(biāo)：設(shè)計(jì)個(gè)人簡(jiǎn)歷，培養(yǎng)學(xué)生的準(zhǔn)職業(yè)人的意識(shí)，加強(qiáng)對(duì)自我學(xué)業(yè)能力的認(rèn)知。利用table標(biāo)簽制作個(gè)人簡(jiǎn)歷table標(biāo)簽及子標(biāo)簽，colspan屬性、rowspan屬性。通過(guò)制作簡(jiǎn)歷來(lái)強(qiáng)化table標(biāo)簽的掌握。colspan屬性、rowspan屬性添加的位置。通過(guò)繪制單元格合并范圍來(lái)講解。運(yùn)用實(shí)例演示法，通過(guò)實(shí)際案例或操作演示，讓學(xué)生直觀理解抽象概念。實(shí)施項(xiàng)目驅(qū)動(dòng)教學(xué)，鼓勵(lì)學(xué)生獨(dú)立或分組完成任務(wù)，培養(yǎng)團(tuán)隊(duì)協(xié)作與問(wèn)題解決能力。利用在線實(shí)訓(xùn)平臺(tái)，提供個(gè)性化學(xué)習(xí)路徑，滿足不同水平學(xué)生的學(xué)習(xí)需求。通過(guò)提問(wèn)或講授的形式回顧之前的知識(shí)點(diǎn)，引入本次課的相關(guān)知識(shí)點(diǎn)的背景知識(shí)，然后講授具體的知識(shí)要點(diǎn)及任務(wù)實(shí)現(xiàn)的注意事項(xiàng)，通過(guò)任務(wù)實(shí)施環(huán)節(jié)讓學(xué)生各自或分組進(jìn)行練習(xí)。教師隨堂抽查部分作品，根據(jù)課堂表現(xiàn)情況予以適當(dāng)?shù)难a(bǔ)充，根據(jù)學(xué)生接納情況選擇性講解任務(wù)擴(kuò)展內(nèi)容，最后以學(xué)生自我評(píng)價(jià)或小組評(píng)價(jià)完成任務(wù)的檢測(cè)，教師最終進(jìn)行點(diǎn)評(píng)及總結(jié)。Windows操作系統(tǒng)、Hbuilder軟件、谷歌、火狐瀏覽器。隨堂考查、自我評(píng)價(jià)或小組評(píng)價(jià)是否正確、無(wú)誤達(dá)到任務(wù)要求復(fù)習(xí)Table標(biāo)簽所定義的結(jié)構(gòu)如同html結(jié)構(gòu)一般，包括thead、tbody、tfooter三部分。表格的頁(yè)腳部分一般都不會(huì)使用，那什么情況下需要用到頁(yè)腳部分，我們可以分析一下：只要是與表格數(shù)據(jù)有密切相關(guān)，同樣用于后期數(shù)據(jù)處理的表格行，我們都不采用頁(yè)腳，而作為表格數(shù)據(jù)的一些輔助、標(biāo)注性文字，我們就可以使用tfooter將這些文字放置進(jìn)去。回答問(wèn)題教師提問(wèn)，演示。思維導(dǎo)圖法或問(wèn)題導(dǎo)向法幫助學(xué)生整理知識(shí)結(jié)構(gòu)。引入基礎(chǔ)的表格，一般不涉及到行列單元格合并的情況，但是對(duì)于一些復(fù)雜的表格，比如今天要完成的個(gè)人簡(jiǎn)歷，就涉及到單元格合并的相關(guān)屬性。聽(tīng)講講授，演示。任務(wù)驅(qū)動(dòng)法，讓學(xué)生了解任務(wù)目標(biāo)。思考教師引導(dǎo)、提示知識(shí)講授colspan和rowspan是HTML表格中的兩個(gè)屬性，用于合并單元格。colspan屬性用于指定一個(gè)單元格橫向合并的列數(shù)。例如，如果一個(gè)表格有3列，而某個(gè)單元格的colspan屬性值為2，則該單元格將橫跨2列。rowspan屬性用于指定一個(gè)單元格縱向合并的行數(shù)。例如，如果一個(gè)表格有3行，而某個(gè)單元格的rowspan屬性值為2，則該單元格將縱跨2行。使用colspan和rowspan可以創(chuàng)建更復(fù)雜的表格布局，使表格更具有可讀性和美觀性。聽(tīng)講演示任務(wù)達(dá)到的效果，講解代碼演示法讓學(xué)生明確分階段或最終的任務(wù)效果。講授法讓學(xué)生掌握完成本次任務(wù)需要了解的核心知識(shí)點(diǎn)。實(shí)驗(yàn)法可以在講授過(guò)程中對(duì)個(gè)別難以理解的知識(shí)點(diǎn)有直觀的剖析。任務(wù)實(shí)施【案例23】完成個(gè)人簡(jiǎn)歷頁(yè)面效果，如圖4-106所示。圖4-106個(gè)人簡(jiǎn)歷布局效果☆思政講解：求職者系統(tǒng)地梳理個(gè)人經(jīng)歷、技能與成就，明確職業(yè)定位與目標(biāo)。提前制作簡(jiǎn)歷還能促使求職者不斷自我提升，查漏補(bǔ)缺，以更好地匹配市場(chǎng)需求，有助于求職者在激烈的競(jìng)爭(zhēng)中脫穎而出，實(shí)現(xiàn)職業(yè)發(fā)展的順利起步。（1）先簡(jiǎn)單構(gòu)建一些輔助性觀察的代碼，測(cè)試后觀察第一行是否無(wú)誤。（2）整體復(fù)制<tr>代碼塊，快速搭建其他行。（3）文件保存后，預(yù)覽的初步效果。（4）制作單元格跨行、跨列（合并）效果。（5）保存文件，預(yù)覽效果。（6）最后編寫對(duì)應(yīng)的樣式完成細(xì)節(jié)。上機(jī)操作巡堂指導(dǎo)，提醒易出錯(cuò)的事項(xiàng)實(shí)踐法旨在培養(yǎng)學(xué)生項(xiàng)目開(kāi)發(fā)能力。任務(wù)擴(kuò)展如圖4-113所示的結(jié)構(gòu)適不適合采用表格來(lái)布局，請(qǐng)說(shuō)出理由。思考提問(wèn)任務(wù)檢測(cè)被考評(píng)人（組）：考評(píng)人：日期：評(píng)分項(xiàng)目過(guò)程表現(xiàn)分值得分項(xiàng)目搭建站點(diǎn)結(jié)構(gòu)正確，文件命名合理。10Table基本結(jié)構(gòu)使用快捷鍵快速完成大體的html結(jié)構(gòu)。30修改部分td標(biāo)簽，增加合并屬性準(zhǔn)確設(shè)置colspan和rowspan屬性30表格外觀Css樣式設(shè)置合理、預(yù)覽效果美觀30總分說(shuō)明：評(píng)分項(xiàng)目為任務(wù)實(shí)施中要求學(xué)生掌握的技能點(diǎn)?；ハ帱c(diǎn)評(píng)作業(yè)抽樣點(diǎn)評(píng)分組討論法加強(qiáng)團(tuán)隊(duì)協(xié)作能力?？偨Y(jié)通過(guò)本課，要求我們：（1）鞏固table標(biāo)簽的使用。（2）單元格colspan屬性、rowspan屬性的應(yīng)用。（3）使用