<th id="yw6c8"></th>

<strike id="yw6c8"></strike>

<strike id="yw6c8"></strike>

<samp id="yw6c8"><pre id="yw6c8"></pre></samp>

搜索高級搜索

當前位置：論文格式網 -> 免費論文 -> 其他論文

《CSS樣式表》教學設計

本論文在其他論文欄目，由論文格式網整理,轉載請注明來源www.donglienglish.cn,更多論文,請點論文格式范文查看

《CSS樣式表》教學設計
江蘇省栟茶高級中學仇雪梅 226406
一、教材分析
“CSS樣式表”是教科版高中信息技術（選修）《網絡技術應用》的第五章“動態網頁制作”中第二節內容。教材中將這塊內容分為“什么是CSS樣式表”、“CSS樣式表的實現”、“在HTML中加入CSS”三部分。學業考試綱要中對這部分的要求是“CSS樣式表的簡單使用”，對應于理解與獨立操作水平，B類要求。
在近年的學業考試中，這部分知識點出題的機率很高，同樣學生的出錯率也高。此外，學生用FrontPage做網頁都習慣用工具按鈕、菜單命令來進行網頁外觀設置，很少使用代碼來進行編輯。鑒于以上這兩點現狀，我認為，鍛煉學生分析代碼的能力，靈活掌握網頁制作的知識，讓他們切實地體驗到樣式表在制作網頁時的“神奇”就顯得尤為重要。本論文由論文格式網整理,轉載請注明來源www.donglienglish.cn,更多論文,請點論文格式范文查看
二、學生分析
通過前一階段的學習，學生已經對HTML基本標簽、動態網頁的概念、DHTML的核心技術之一（java script語言）有了一定的認識和了解，這些內容為CSS的學習作了很好的鋪墊。因此，對于學生來說，雖然CSS樣式表是全新的內容，但如果教師結合相關案例，聯系之前的學習內容，將會有效激發學生自主探索學習的興趣和熱情，使學生的學習更具挑戰性。
三、教學目標
（一）知識與技能
（1）理解CSS樣式表的概念。
（2）掌握嵌入式、內聯式、外聯式三種樣式表的使用方法。
（3）通過對三種樣式表的親身實踐，感受這三種樣式表的優缺點。
（4）通過CSS樣式表的學習，提高學生美化網頁的技能。
（二）過程與方法
（1）借助WORD排版中的“樣式和格式”引入網頁中的“CSS樣式表”，通過類比，使學生初步了解CSS樣式表的作用，激發其學習興趣。
（2）對于嵌入式、內聯式、外聯式三種樣式表的使用，由教師講授和演示代碼，引導學生自我實踐操作，并進行合作學習。
（三）情感價值
（1）培養學生分析代碼的能力，鍛煉其探索與實踐能力。
（2）通過實踐過程中合作學習，讓學生感受彼此之間的團結協作。
四、教學重難點
本節課的重點是讓學生理解CSS樣式表的概念，并熟練掌握嵌入式、內聯式、外聯式三種樣式表的使用方法。難點在于培養學生分析代碼的能力，使學生舉一反三，創造出個性的網頁。
五、教學環境：網絡機房
六、教學過程
（1）新課導入
教師演示：教師通過終端控制系統，向學生集體展示Word文檔1。其中，文檔1的內容已經設置了具體的樣式（效果如下圖）：

教師提問：如果現在要求大家快速給三級標題也定義一個樣式，該怎么操作？
教師活動：教師分發Word文檔1給所有同學，要求大家進行操作。教師巡回輔導，及時了解學生的學習情況。
學生活動：學生進行自我練習，或者相互討論。
教師演示：教師總結學生的操作情況，并借助“樣式和格式”工具，演示如何具體修改文本內容的格式。
教師總結：我們通過剛才的操作，可以概括出:“‘樣式’是指用有意義的名稱保存的字符格式和段落格式的集合，這樣在編排重復格式時，先創建一個該格式的樣式，然后在需要的地方套用這種樣式，就無須一次次地對它們進行重復的格式化操作了�！�
教師提問：那么，我們網頁制作中如何定義樣式，以減少代碼的書寫量？今天，我們就來學習網頁制作中“CSS樣式表的應用”。
【設計思路】：借助WORD排版中的“樣式和格式”引入網頁中的“CSS樣式表”，通過類比，使學生初步了解樣式的作用，激發學習興趣。
（2）新課講授
什么是CSS樣式表？
教師講授：講解CSS樣式表的概念。
CSS(Cascading Style Sheet),層疊樣式表，簡稱樣式表，是近幾年才發展起來的新技術，誕生于1996年底。它是用于（增強）控制網頁樣式并允許將樣式信息與網頁內容分離的一種標記性語言。

②我們為什么應用CSS樣式表？
教師講授：概述CSS樣式表的優點。
只需要修改一個CSS代碼文件就可以改變頁數不定的網頁外觀和格式。
可以“隨心所欲”地控制頁面布局和外觀。
在所有瀏覽器和平臺之間具有較好的兼容性。
能精簡網頁，提高下載速度。
教師演示：利用Frontpage制作的一個簡單的學校網站導航條和其下拉菜單（要求：當點擊最上行四個導航條之一時，會自動出現其下拉菜單，并且當點擊每一個下拉菜單時，光標會變成手型并凸顯顏色），體現CSS樣式表在工作量較大的網頁制作中的優越性。

教師活動：逐步分析和講解該典型案例，進而讓學生初步明白，CSS樣式表在繁復的網頁制作中具有很大的便捷性，進而激發學生的好奇心。
學生活動：體會CSS樣式表的優點。
③如何在HTML中加入樣式？
教師講授：方法一：嵌入式樣式表（具體操作：只需在每個要應用樣式的HTML的標記后寫上CSS屬性就可以了。）
教師演示：舉例——簡單的文字字體的瀏覽效果。

學生活動：自己上機操作練習。
教師活動：巡回輔導，提醒學生注意字母、標點的輸入。
教師總結：由此可見，嵌入式樣式表主要用于對具體的標簽作調整，其作用的范圍只限于本標簽，這樣未能充分體現出CSS樣式表的優越性。
教師講授：方法二：內聯式樣式表（具體操作：在網頁的<head> </head>定義樣式）
如：<style type=“text/css”>
CSS內容
</style>
教師演示：打開Frontpage制作的學校網站導航條實例，進一步讓學生體會內聯式樣式表的結構。
教師提問：同學們可以用內聯式樣式表完成我們剛才的例子（文字字體瀏覽效果）嗎？
學生活動：學生打開Frontpage，自己操作實踐。如學習有困難，可以和鄰座同學相互合作完成。
教師活動：巡回輔導，檢查學生課堂聽課效率。
教師演示：打開Frontpage，利用內聯式樣式表實現文字字體瀏覽效果。
學生活動：學生基本可以利用內聯式樣式表實現字體瀏覽效果的變化。
教師提問：如果我們的另一個網頁需要應用類似學校網站導航條的樣式，怎么操作？
學生回答：可以將樣式表內容復制到需要的網頁中。
教師提問：如果我們有幾十個網頁都需要采用該樣式，復制方便嗎？很顯然，復制顯得麻煩，我們有更好的方法——可以采用外聯式樣式表提高制作網頁的效率。
教師講授：方法三：外聯式樣式表（具體操作：首先，將樣式定義成一個“.css”的文件（可在記事本中輸入樣式代碼），然后保存為擴展名為“.css”的文件。然后，在網頁的head區插入引用代碼：<link rel=stylesheet type=“text/css” href=“樣式表文件名.css” >
教師演示：打開Frontpage，利用外聯式樣式表實現字體瀏覽的效果。
學生活動：依據教師講的方法，進行自主練習。
教師活動：巡回輔導，提醒學生定位插入點要準確，輸入字母、標點也一定要準確。樣式文件和網頁文件必須要保存于同一個文件夾內。
【設計思路】：圍繞“是什么，為什么，怎么做”的教學思路，講解CSS樣式表的概念、優缺點，以及在網頁制作中的具體應用，從而啟發學生舉一反三，創造出個性的網頁。

（3）課堂小結
教師活動：通過課程的學習，同學們知道了CSS樣式表的概念、優缺點，掌握了三種CSS樣式表的使用。通過實踐操作，同學們也體會到了使用CSS樣式表可以避免很多重復操作，從而提高網頁編輯和修改的效率。希望大家能夠舉一反三，創造出更多的個性化網頁。
七、教學反思
在新課導入過程中，借助WORD排版中的“樣式和格式”引入網頁中的“CSS樣式表”，通過類比，使學生初步了解樣式的作用，激發其學習興趣；在新課講授過程中，圍繞“是什么，為什么，怎么做”的教學思路，講解了CSS樣式表的概念、優缺點，以及在網頁制作中的具體應用，從而啟發學生舉一反三，創造出個性的網頁�？傮w而言，自我感覺學生的學習效果比較好。此外，在學生實踐過程中，他們可以互相幫忙糾錯或者討論，這樣既讓學生感受了同學互助，又獲得了很好的學習效果。

相關論文


上一篇：體驗CSS樣式表――在HTML中應用CS..	下一篇：《中國傳統節日節徽的設計》的教..

Tags：CSS 樣式教學設計

【收藏】【返回頂部】

人力資源論文	金融論文
會計論文	財務論文
法律論文	物流論文
工商管理論文	其他論文
保險學免費論文	財政學免費論文
工程管理免費論文	經濟學免費論文
市場營銷免費論文	投資學免費論文
信息管理免費論文	行政管理免費論文
財務會計論文格式	數學教育論文格式
數學與應用數學論文	物流論文格式范文
財務管理論文格式	營銷論文格式范文
人力資源論文格式	電子商務畢業論文
法律專業畢業論文	工商管理畢業論文
漢語言文學論文	計算機畢業論文
教育管理畢業論文	現代教育技術論文
小學教育畢業論文	心理學畢業論文
學前教育畢業論文	中文系文學論文

最新文章

熱門文章

計算機論文

推薦文章

<th id="ygyai"></th>

<th id="ygyai"></th>

<ul id="ygyai"></ul>

<ul id="ygyai"><tbody id="ygyai"></tbody></ul>

<th id="ygyai"></th>