1、武進規劃局網站建設武進規劃局網站建設 網網 頁頁 頁頁 面面 設設 計計 任務編號：任務編號：2-32-3地 點： 網影科技有限公司網頁設計部時 間： 上午8：30主 持： 網頁設計部項目總監參加人員：網頁設計部各項目組經理及成員會議議題：BTB資訊網站建設項目中網頁頁面設計 創建情境創建情境網頁設計部每周例會制作完成頁面設計原型制作完成頁面設計原型制作完成界面動畫設計制作完成界面動畫設計試做網頁試做網頁,將頁面元素插入到將頁面元素插入到頁面中，并進行規范設計頁面中，并進行規范設計已完成工作會 前項目經理安排人員分工分析任務 查找資料 初稿試做 準備匯報材料 1.工作匯報 （1）組內分工情況（

2、2）任務完成情況 （3）展示成果5.BTB項目代表指出問題6.各項目組相互點評，提出解決方案8.修改完善方案9.總結規范2.針對匯報，提出問題3.評價核實任務完成情況4.按考核標準評分7.對難點進行技術指導創新設計 匯報創新方案點評方案，總結歸納布置新任務布置新任務 教師教師( (項目總監項目總監) )學生（項目經理和項目組成員）學生（項目經理和項目組成員）完成方案完成方案方案創新方案創新任務前期準備任務前期準備任務執行任務執行規規 范范設置文字、列表、分段等規范設置文字、列表、分段等規范如何豐富網頁效果如何豐富網頁效果, ,簡單應用簡單應用JavaSciptJavaScipt方方 法法定義定

3、義CSSCSS樣式設置鏈接樣式設置鏈接用表格進行頁面布局用表格進行頁面布局簡單簡單JavaSciptJavaScipt的應用方法的應用方法討論分析與解決討論分析與解決思思 路路1.1.表格規范設計網頁的方法表格規范設計網頁的方法2.2.應用應用JavaSciptJavaScipt的方法的方法討論分析與解決討論分析與解決規規 范范如何設置文字、列表、分段等規范如何設置文字、列表、分段等規范布局規劃布局規劃解決方法解決方法1.1.網頁中文字、列表及分段的常用方式網頁中文字、列表及分段的常用方式2.2.網頁中鏈接的設置規范網頁中鏈接的設置規范討論分析與解決討論分析與解決規規 范范2.如何豐富網頁效果

4、如何豐富網頁效果, ,簡單應用簡單應用JavaSciptJavaScipt簡單的簡單的JavaScriptJavaScript應用應用 1 1、標簽的應用標簽的應用 2 2、 JavaScriptJavaScript文件命名、保存位置文件命名、保存位置的規范的規范JavaSciptJavaScipt應用應用解決方法解決方法討論分析與解決討論分析與解決CSS樣式與應用樣式與應用解決方法解決方法CSS樣式的作用：樣式的作用：能夠設置格式規則能夠設置格式規則,從而控制網頁內容的外觀從而控制網頁內容的外觀操作步驟：操作步驟：思思 路路1.1.使用使用CSSCSS樣式對網頁進行規范設計的方法樣式對網頁進

5、行規范設計的方法設置樣式表運用對象設置樣式表運用對象( (選擇類型選擇類型) )選擇標簽選擇標簽設置樣式表運用范圍設置樣式表運用范圍設置格式規則設置格式規則應用應用CSS樣式樣式討論分析與解決討論分析與解決2.2.表格規范設計網頁的方法表格規范設計網頁的方法表格設計規范表格設計規范思思 路路1.1.分析頁面布局模式，確定表格的行列數分析頁面布局模式，確定表格的行列數2.2.確定布局設計表格規范：確定布局設計表格規范： 邊框寬度、單元格間距的設置邊框寬度、單元格間距的設置3.3.利用利用1 1像素圖片固定表格布局像素圖片固定表格布局討論分析與解決討論分析與解決鏈接的制作鏈接的制作方方 法法1.1

6、.定義定義CSSCSS樣式設置鏈接樣式設置鏈接鏈接的四個狀態：鏈接的四個狀態： a:link 鏈接鏈接 a:active 活動鏈接活動鏈接 a:visited 訪問過的鏈接訪問過的鏈接 a:hover 鼠標處在鏈接上鼠標處在鏈接上鏈接的外觀設置鏈接的外觀設置: : 下劃線的設置下劃線的設置討論分析與解決討論分析與解決表格布局表格布局方方 法法2.2.用表格進行頁面布局用表格進行頁面布局1.1.表格和嵌套表格的設置方法表格和嵌套表格的設置方法2.2.設置表格基本屬性設置表格基本屬性3.3.插入表格中的頁面元素插入表格中的頁面元素討論分析與解決討論分析與解決添加特效添加特效方方 法法3.3.應用應

7、用JavaSciptJavaScipt的方法的方法1.1.利用網絡搜索利用網絡搜索JavaSciptJavaScipt的應用效果的應用效果2.2.簡單的簡單的JavaScriptJavaScript應用應用 標簽的應用標簽的應用1 1） CSSCSS樣式設計規范：樣式設計規范：（1 1）分析需要設置的格式規則）分析需要設置的格式規則 分析一般規律，設置規則分析一般規律，設置規則（2 2）新建）新建CSSCSS樣式表樣式表（3 3）根據）根據CSSCSS樣式不同的運用范圍樣式不同的運用范圍, ,可以設置僅對可以設置僅對當前文檔或保存成獨立的文件，應用到多個文檔當前文檔或保存成獨立的文件，應用到多個文檔。歸納總結歸納總結2）表格的設計規范）表格的設計規范（1）根據頁面布局模式，確定插入表格的行列數根據頁面布局模式，確定插入表格的行列數（2）確定表格的邊框寬度、單元格間距的設置確定表格的邊框寬度、單元格間距的設置（3）利用利用1 1像素圖片固定表格布局像素圖片固定表格布局歸納總結歸納總結3）JavaScript應用的設計規范應用的設計規范（1 1