《網頁制作》課程教學大綱

1、網頁制作課程教學大綱課程編碼：171210040課程性質：專業(yè)方向先選課程適用專業(yè)：信息與計算科學本科專業(yè)、統計學本科專業(yè)學時學分： 48學時 2學分所需先修課：信息技術基礎編寫單位：數學與信息科學系一、課程說明1、課程簡介網頁制作是信管專業(yè)的一門必修的專業(yè)選修課。本課程講述了網站創(chuàng)建、網頁制作基本知識、Dreamweaver網頁制作集成工具使用的方法、html標記、css屬性設置等內容。通過本課程的學習，使學生掌握構建網站的基本知識，熟悉網頁開發(fā)平臺的使用，能夠獨立的創(chuàng)建個人網站。2、教學目標要求 通過本課程的學習，讓學生能夠掌握html標記語言、css屬性設置的基本概念；掌握網頁制作的方法

2、和技巧。3、教學重點難點Html標記、Css樣式表、Javascript。4、考核方式 本課程是考查課，考試的形式是學期末學生上機制作一個網站，考核標準是基本能夠掌握網頁制作的方法和技巧并在所制作的網頁中應用?？荚囌计綍r、期末的100%。5、學時分配表章次教學內容理論課學時數實驗（實踐）課學時數第1章網頁技術學前班12第2章網頁制作的第一次接觸1第3章html網頁的整體設置1第4章html網頁中的文字和段落1第5章html網頁中的圖片11第6章插入外部資源1第7章強大的表格12第8章和程序交互的利器表單1第9章網頁的框架頁面11第10章css的第一次接觸14第11章css布局方法2第12章cs

3、s網頁元素設計2第13章css編寫技巧1第14章javascript的第一次接觸12第15章javascript程序基礎知識2第16章javascript程序核心語法2第17章javascript核心對象2第18章瀏覽器對象模型1第19章文檔對象模型2第20章事件響應2第21章javascript綜合范例1第22章制作個人網站22第23章制作門戶網站22小計3216總計48二、各部分教學綱要第1章 網頁技術學前班（1學時）教學目標了解internet相關基礎知識，掌握html結構。本章重點Tcp/ip協議、url地址、html結構本章難點 Html結構教學內容第1篇 html網頁技術第1章 網

4、頁技術學前班1.1 internet相關技術介紹1.1.1 tcp/ip協議1.1.2 ip地址和域名簡介1.1.3 url簡介1.1.4 web瀏覽器1.2 internet技術的應用1.3 html網頁技術簡介1.3.1 什么是html1.3.2 html網頁的結構1.3.3 如何獲取網頁的html1.4 靜態(tài)網頁和動態(tài)網頁1.4.1 有動畫的網頁就是動態(tài)網頁嗎1.4.2 有了動態(tài)網頁還有必要學習html嗎1.4.3 網站簡介1.5 小結第2章網頁制作的第一次接觸（1學時）教學目標掌握IIS的安裝、屬性的配置；了解網頁制作的基本流程。本章重點IIS本章難點 IIS的屬性配置教學內容第2章

5、網頁制作的第一次接觸2.1 配置web服務器運行環(huán)境.2.1.1 系統要求2.1.2 iis是干什么的2.1.3 安裝iis2.1.4 配置iis2.1.5 網頁制作工具的選擇12.2 了解網頁技術的工作原理2.2.1 靜態(tài)html的工作流程2.2.2 如何設置web技術中的訪問路徑2.2.3 網頁中怎么表示顏色2.2.4 學習網頁技術的順序2.3 制作一個完整的html網頁2.3.1 怎樣寫html網頁的標簽2.3.2 完成第一個網頁2.4 小結第3章html網頁的整體設置（1學時）教學目標掌握html文件頭部信息的設置方法；了解網頁制作和css、javascript關系。本章重點Html標

6、記本章難點 Html標記教學內容第3章 html網頁的整體設置3.1 html的頭部信息設置3.1.1 定義網頁的標題3.1.2 設置網頁的基底網址3.1.3 掌握強大的元信息標簽3.1.4 怎樣和css及javascript產生聯系3.1.5 頭部信息的其他設置3.2 html主體的常用設置3.2.1 設置網頁的背景色3.2.2 設置網頁的背景圖片3.3 頁面的整體邊距3.4 html代碼的注釋3.5 小結第4章html網頁中的文字和段落（1學時）教學目標掌握html標記中段落、換行、水平線、文字修飾的用法；掌握列表的用法；掌握添加超級鏈接的用法。本章重點Html標記、列表、超鏈接本章難點

7、Html標記教學內容第4章 html網頁中的文字和段落4.1 段落排版和換行4.1.1 給大段文字進行分段4.1.2 給文字加入空格4.1.3 設置文字換行與不換行4.1.4 設置文字對齊方式4.1.5 添加水平分隔線4.2 文字的多樣化修飾4.2.1 文字樣式設置的基本標簽font4.2.2 設置文字的顏色4.2.3 設置文字的尺寸4.2.4 設置文字的字體4.2.5 使文字傾斜4.2.6 使文字加粗4.2.7 給文字加下畫線4.2.8 多種標題樣式的使用4.2.9 學會處理網頁中的特殊字符4.2.10 如何更方便地忽略瀏覽器對部分html的解析4.2.11 其他文字修飾方法4.3 制作滾動

8、文字4.3.1 設置文字滾動4.3.2 設置文字滾動的方向4.3.3 設置文字滾動的速度和形式4.4 用于組織數據的列表4.4.1 列表的結構組成4.4.2 制作無序列表4.4.3 制作有序列表4.5 超級鏈接4.5.1 給文字添加鏈接4.5.2 修改鏈接的窗口打開方式4.5.3 給鏈接添加提示文字4.5.4 什么是錨（anchor）4.5.5 電子郵件、ftp和telnet的鏈接4.6 小結第5章html網頁中的圖片（1學時）教學目標掌握html標記中圖片以及圖片屬性設置的使用方法；掌握制作滾動圖片的方法。本章重點Html標記、img本章難點 Img教學內容第5章 html網頁中的圖片5.1

9、 認識網頁中的圖片格式5.1.1 常用的圖片格式5.1.2 選擇合適的圖片格式5.2 插入圖片5.2.1 插入圖片到網頁5.2.2 設置圖片的高度和寬度5.2.3 設置圖片的邊框5.2.4 給圖片添加提示文字5.2.5 給圖片添加替代文字5.3 圖文混合排版5.4 給圖片加鏈接5.5 制作滾動圖片5.6 小結第6章插入外部資源（1學時）教學目標掌握html中插入flash、聲音、javascript腳本的方法并設置插入對象的屬性。本章重點插入外部資源本章難點 插入外部資源教學內容第6章 插入外部資源6.1 插入多媒體資源6.1.1 為網頁添加背景聲音6.1.2 為網頁添加音樂、動畫等更多媒體資

10、源6.2 插入外部程序6.2.1 插入外部javascript程序6.2.2 區(qū)分程序的客戶端程序與服務器端程序6.3 小結第7章強大的表格（1學時）教學目標掌握網頁中表格布局的方法；掌握表格的相關操作，添加、刪除、插入行列、刪除行列、合并單元格、拆分單元格、設置表格、單元格的屬性。本章重點表格標記、行標記、單元格標記本章難點 表格標記教學內容第7章 強大的表格7.1 認識表格的作用7.1.1 用表格組織數據7.1.2 用表格布局網頁7.2 創(chuàng)建一個表格7.2.1 表格的基本構成7.2.2 tr與td的配合7.2.3 表頭組和表尾組的設置7.2.4 創(chuàng)建一個完整的表格7.3 表格的整體控制7.

11、3.1 控制表格的高度和寬度7.3.2 調整表格的水平對齊方式7.3.3 嘗試不同類型的表格邊框7.3.4 調整表格的填充和間距7.3.5 改變表格的背景色及背景圖片7.4 表格行的控制7.4.1 整行的高度設置7.4.2 行內的對齊控制7.5 表格單元格的控制7.5.1 控制單元格的高度和寬度7.5.2 單元格的對齊設置7.5.3 合并多個單元格7.6 表格的互相嵌套7.6.1 嵌套表格的作用7.6.2 表格布局網頁實例7.6.3 用photoshop切片迅速生成布局表格7.7 小結第8章和程序交互的利器-表單（1學時）教學目標掌握網頁中插入表單、插入表單控件的方法；掌握設置表單屬性、表單控

12、件屬性的方法。本章重點表單、控件屬性本章難點 表單教學內容第8章 和程序交互的利器表單8.1 表單的用途及屬性8.1.1 表單的用途8.1.2 表單的結構8.1.3 表單的數據傳遞方式8.2 表單的控件8.2.1 單行文本框控件和密碼框控件8.2.2 多行文本框控件8.2.3 不同類型的按鈕控件8.2.4 單選框控件和復選框控件8.2.5 下拉列表和列表框控件8.2.6 圖像域控件、文件域控件和隱藏域控件8.3 實戰(zhàn)表單制作8.3.1 表單控件的分組方法8.3.2 用戶注冊表單頁面實例8.4 小結第9章網頁的框架頁面（1學時）教學目標掌握網頁中框架的使用方法。本章重點Frame、iframe本

13、章難點 Frame、iframe教學內容第9章 網頁的框架頁面9.1 用框架靈活地組織網頁9.1.1 框架在網站中的作用9.1.2 框架的結構分析9.2 建立完整的框架頁面9.2.1 建立窗口框架集9.2.2 幀的比例調整9.2.3 調整幀邊框屬性9.2.4 設置幀滾動條9.2.5 復雜幀結構的框架頁面9.3 特殊的iframe框架9.3.1 使用iframe的好處9.3.2 設置浮動框架屬性9.4 框架綜合實例9.5 小結第10章css的第一次接觸（1學時）教學目標掌握網頁制作中css樣式表的使用方法；掌握css屬性設置的方法。本章重點Css本章難點 Css教學內容第2篇 css網站布局與樣

14、式第10章 css的第一次接觸10.1 何謂web標準10.1.1 理解web標準的基本組成和內涵10.1.2 關于web標準與瀏覽器的兼容性10.2 xhtml與css的概念10.2.1 xhtml與css實現樣式與結構分離10.2.2 css布局與表格布局的分析10.3 xhtml的基本知識10.4 css編寫基本模式10.4.1 css的聲明方法10.4.2 css的媒介控制10.5 css的基本語法10.5.1 css通過接口作用于xhtml元素10.5.2 css的屬性和選擇符10.5.3 css的各種選擇符詳解10.5.4 id和class的區(qū)別10.6 css的顏色和數值單位10

15、.7 小結第11章網頁的框架頁面（2學時）教學目標掌握利用div布局網頁的方法；掌握div+css制作網頁的設置div的樣式的方法。本章重點Div布局、css設置本章難點 Div布局、css設置教學內容第11章 css布局方法11.1 什么叫“div+css”11.1.1 初識div11.1.2 xhtml中的塊狀元素和內聯元素11.1.3 div元素的樣式設置11.1.4 布局頁面的寬度11.1.5 布局頁面水平居中11.1.6 div元素的嵌套11.1.7 div元素的浮動11.1.8 一些高級的div布局技巧11.1.9 一個典型的網頁布局實例11.2 列表元素布局11.2.1 列表元素

16、制作導航條11.2.2 列表元素的綜合使用導航條制作11.2.3 導航條的互動布局11.3 css盒模型11.3.1 什么是css盒模型11.3.2 外邊距的控制11.3.3 邊框的樣式設置11.3.4 內邊距的設置11.3.5 盒模型兼容問題11.4 元素的非常規(guī)定位方式11.4.1 css絕對定位11.4.2 css固定定位11.4.3 css相對定位11.5 小結第12章css網頁元素設計（2學時）教學目標掌握css設置中關于背景樣式、背景圖片、超級鏈接、列表、段落、字體等屬性的使用方法。本章重點css設置本章難點 css設置教學內容第12章 css網頁元素設計12.1 背景樣式控制12

17、.1.1 背景色樣式12.1.2 背景圖片樣式的分類12.1.3 背景圖片樣式的模擬12.1.4 背景圖片的位置12.1.5 固定背景圖片12.1.6 背景屬性縮寫設置12.1.7 背景樣式綜合示例12.2 超級鏈接深入應用12.2.1 超級鏈接偽類的應用實例112.2.2 超級鏈接偽類的應用實例212.3 表單的css設計12.4 列表的css設計12.4.1 列表演示12.4.2 列表顯示技巧12.4.3 使用圖片作為列表符號12.5 段落及字體樣式設計12.5.1 字體樣式的設計12.5.2 字體修飾12.5.3 段落樣式的設計12.5.4 設置行距12.5.5 段落內容裁剪12.5.6

18、 縱向段落排版12.6 圖片樣式控制12.6.1 圖片作為超鏈接12.6.2 漂亮的圖文排版12.6.3 技巧圖片裁切12.7 css濾鏡12.7.1 如何使用css濾鏡12.7.2 css濾鏡綜合實例12.8 小結第13章css編寫技巧（1學時）教學目標掌握css設置中class、id、標簽的使用方法；了解css設置關于ie和firefox的不同之處。本章重點css設置本章難點 css設置教學內容第13章 css編寫技巧13.1 css設計與編寫原則13.1.1 養(yǎng)成好的命名習慣13.1.2 用好id和class13.1.3 提高代碼重用率技巧113.1.4 提高代碼重用率技巧213.1.5

19、 提高代碼重用率技巧313.1.6 css屬性值的縮寫13.2 瀏覽器解析css的兼容問題13.2.1 ie瀏覽器版本兼容問題的解決辦法13.2.2 ie與firefox之間兼容問題的解決辦法13.2.3 ie與firefox之間兼容問題的解決辦法：屬性選擇符13.2.4 ie與firefox之間兼容問題的解決辦法：子對象選擇符13.2.5 ie與firefox之間兼容問題的解決辦法：符號修飾選擇符13.3 小結第14章javascript的第一次接觸（1學時）教學目標了解javascript的用處；掌握插入javascript腳本的方法。本章重點插入javascript腳本本章難點 插入ja

20、vascript腳本教學內容第3篇 javascript動態(tài)行為第14章 javascript的第一次接觸14.1 什么是javascript14.2 javascript有什么功能14.3 在什么地方編寫javascript14.4 寫一個簡單的javascript程序14.5 小結第15章javascript程序基礎知識（2學時）教學目標掌握javascript腳本應用的基本語法。本章重點數據類型、變量、運算符本章難點 javascript腳本教學內容第15章 javascript程序基礎知識15.1 javascript的基本語法15.1.1 字母大小寫編寫規(guī)范15.1.2 javasc

21、ript代碼編寫格式15.1.3 注釋格式15.1.4 保留字15.1.5 基本的輸出方法15.1.6 關于script/script標簽的聲明15.2 javascript交互基本方法15.2.1 最常用的信息對話框15.2.2 選擇對話框15.2.3 顯示提示的對話框15.3 數據類型和變量15.3.1 數據類型的理解15.3.2 學習幾種基本數據類型15.3.3 變量的含義15.3.4 變量的聲明與使用15.4 常用的運算符15.4.1 運算符與表達式15.4.2 基本算術運算符及使用15.4.3 關系運算符及使用15.4.4 邏輯運算符及使用15.4.5 其他常用運算符及使用15.5

22、小結第16章javascript程序基礎知識（2學時）教學目標掌握javascript腳本中分支語句、循環(huán)語句、函數、數組等的應用方法。本章重點分支語句、循環(huán)語句、函數、數組本章難點 分支語句、循環(huán)語句、函數、數組教學內容第16章 javascript程序核心語法16.1 程序的核心：分支和循環(huán)16.1.1 if和switch的條件分支16.1.2 while和dowhile循環(huán)16.1.3 for和forin循環(huán)16.1.4 如何更合理地控制循環(huán)語句16.2 函數16.2.1 什么是函數16.2.2 學會使用函數解決問題16.2.3 理解函數的參數傳遞16.2.4 函數中變量的作用域和返回值

23、16.2.5 函數的嵌套16.3 面向對象編程的簡單概念16.3.1 什么是面向對象16.3.2 如何創(chuàng)建對象16.3.3 定義對象的屬性16.3.4 對象的構造函數和方法16.3.5 關聯數組的概念16.3.6 with語句和forin語句16.4 小結第17章javascript核心對象（2學時）教學目標掌握日期對象、數學運算對象、字符串對象、函數對象的使用方法。本章重點函數對象本章難點 面向對象教學內容第17章 javascript核心對象17.1 數組對象17.1.1 創(chuàng)建數組17.1.2 數組元素的操作17.1.3 創(chuàng)建多維數組17.1.4 數組的方法17.2 日期對象17.2.1

24、用date對象創(chuàng)建常用日期17.2.2 date日期對象的方法17.2.3 編寫一個時間計算程序17.3 數學運算對象17.3.1 數學運算對象的方法和屬性17.3.2 做一個小型計算器17.4 字符串對象17.4.1 字符串對象的屬性17.4.2 字符串對象的方法17.5 函數對象17.6 小結第18章瀏覽器對象模型（1學時）教學目標掌握javascript腳本基于瀏覽器對象的操作方法。本章重點操作瀏覽器對象本章難點 操作瀏覽器對象教學內容第18章 瀏覽器對象模型18.1 navigator瀏覽器信息對象18.1.1 navigator對象的管理方法18.1.2 在網頁上顯示瀏覽者系統的基本

25、信息18.2 window對象18.2.1 window對象的管理方法18.2.2 制作可定制的彈出窗口18.2.3 完美地關閉窗口18.2.4 制作簡單網頁動畫18.2.5 延時執(zhí)行命令18.3 location對象18.4 history對象18.5 screen對象18.6 小結第19章瀏覽器對象模型（2學時）教學目標掌握javascript腳本基于文檔對象、表單數據驗證的操作方法。本章重點表單數據驗證本章難點 表單數據驗證教學內容第19章 文檔對象模型19.1 文檔對象模型概念詳解19.1.1 文檔對象模型簡介19.1.2 文檔對象的屬性19.1.3 文檔對象的方法19.2 forms

26、對象19.2.1 訪問表單對象的方法19.2.2 表單控件19.2.3 制作數據檢測功能的注冊頁面19.3 image對象19.4 鏈接對象19.5 小結第20章事件響應（2學時）教學目標了解javascript腳本事件響應的編程的概念；掌握添加javascript事件響應的方法。本章重點添加網頁行為本章難點 添加網頁行為教學內容第20章 事件響應20.1 事件響應編程的概念20.1.1 事件和事件處理程序20.1.2 html元素常用事件的展示20.2 事件方法的使用20.3 event對象20.3.1 event對象的各種屬性20.3.2 網頁監(jiān)視發(fā)生事件的元素20.3.3 網頁檢測用戶的

27、鼠標信息20.3.4 網頁檢測用戶的鍵盤按鍵信息20.3.5 鼠標隨意拖動網頁元素20.4 事件編程訪問網頁元素20.4.1 數組方式訪問20.4.2 id名稱和name名稱訪問20.4.3 html標簽名稱訪問20.4.4 dom節(jié)點方法訪問20.5 結合css制作動態(tài)頁面20.5.1 讓html元素動起來20.5.2 通過切換css給網頁換膚20.5.3 動態(tài)添加節(jié)點20.6 小結第21章javascript綜合范例（3學時）教學目標熟練掌握網頁制作中javascript腳本的應用。本章重點Javascript本章難點 Javascript教學內容第21章 javascript綜合范例21

28、.1 流行的應用：javascript選項卡切換內容塊21.1.1 思路分析21.1.2 編寫內容容器切換程序21.1.3 選項卡切換實例功能編寫21.1.4 選項卡切換實例美化21.2 仿貓撲：網頁框架伸縮21.2.1 思路分析21.2.2 分析javascript的框架操作21.2.3 框架伸縮實例功能編寫21.2.4 框架伸縮實例美化21.3 實用多級導航條21.3.1 思路分析21.3.2 css二級導航條實例功能編寫21.3.3 完善css二級導航條實例21.3.4 javascript制作導航條21.4 各種對聯廣告的制作21.4.1 分析對聯廣告如何適應不同分辨率屏幕21.4.2 分析對聯廣告如何關閉21.4.3 固