HTML教案第四章資料_第1頁
HTML教案第四章資料_第2頁
HTML教案第四章資料_第3頁
HTML教案第四章資料_第4頁
HTML教案第四章資料_第5頁
已閱讀5頁，還剩3頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

《 HTML 》理論課教案第4章CSS樣式表TOC\o"1-3"\u一、 整章授課思路[100分鐘] 21. 回顧、預習檢查、任務、目標部分[10分鐘] 22. [表單頁面的基本結枸[10分鐘] 32.1 為什么需要表單？ 32.2 表單包含的控件： 32.3 表單頁面的基本結構。 33. 各種表單控件的逐一介紹[20分鐘] 43.1 表單元素的統(tǒng)一格式。 43.2 各種表單元素逐一介紹，先講解語法，然后舉例 44. 課堂練習[15分鐘] 55. 框架[25分鐘] 55.1 框架窗口的組成 55.2 框架的使用場合。 55.3 框架的基本結構。 55.4 如何創(chuàng)建多個復雜的窗口。 55.5 如何設置窗口鏈接的顯示位置。 56. 課堂練習2[15分鐘] 67. 總結[5分鐘] 6二、 學員問題匯總 6三、 作業(yè)布置 6

課時：3課時本章工作任務制作并美化“登陸”頁面：美化“寶貝分類”頁面本章技能目標會創(chuàng)建無下劃線的超鏈接樣式會創(chuàng)建統(tǒng)一外觀的字體文本會創(chuàng)建個性化的表單會創(chuàng)建個性化的表格本章重點樣式的基本語法會創(chuàng)建常見的樣式：統(tǒng)一的文字、顏色等外觀、無下劃線的超鏈接、細邊框輸入框本章難點內嵌樣式、行內樣式、樣式表文件的使用場合本章單詞整章授課思路[100分鐘]采用邊講邊練的方式，講解順序如下：為什么需要CSS演示表。樣式表的基本語法。逐一介紹常用的樣式屬性并舉例：文本屬性、背景屬性、方框屬性、無下劃線的超文本鏈接樣式，中間穿插課堂練習。樣式表的三類應用方式：行內、內嵌、外部樣式表?；仡櫋㈩A習檢查、任務、目標部分[10分鐘]根據PPT中提供的問題，逐一提問學員，注意給予學員引導，建立學員的信心。為什么需要CSS樣式表[10分鐘]為什么需要CSS樣式表？引入：前幾次課所學的標簽，在網頁中呈現(xiàn)出的效果，比較簡單，樣式比較單一。CSS主要用于改變網頁中標簽的樣式，使網頁變得更華麗?？梢詮耐庥^上更能吸引讀者。CSS相當于華麗的衣服樣式表能實現(xiàn)內容與樣式的分離，方便團隊開發(fā)。樣式表的基本語法[10分鐘]樣式表的基本結構。樣式規(guī)則并舉例說明。引入類樣式。課堂案例：樣式表的基本語法文本屬性[5分鐘]引入：首先從文本的大小，顏色，字體等來描述文本屬性。強調用樣式來實現(xiàn)文本的大小顏色字體的顯示的好處課堂案例： 課堂練習[10分鐘]做“申請表”的表單練習，參考“課堂聯(lián)系案例\課堂練習1”。背景屬性[5分鐘]引入：首先從文本的大小，顏色，字體等來描述文本屬性。講解要點：backcolor,background-image,background-repeat3個屬性的基本用法。注意：Background-repeat的使用場合：當用較小的gif圖片作為網頁背景時，就會用到如何重復的問題，是橫向還是縱向。樣式還有一種簡潔的寫法就是吧各種屬性放置在一起，用空格隔開，如下所示：Body{ Background:#999ff00 url(../image/css_tutorials/background.jpg) no-repeatfixed40px100px}課堂案例：方框屬性[15分鐘]引入：首先從文本的大小，顏色，字體等來描述文本屬性。講解要點：盒子模式：以網頁中放入的一副圖片，說明盒子模式設計的各種邊界、填充、邊框的含義。應用邊框屬性、填充屬性，制作常見的表格多列中分界線樣式。應用邊框屬性，制作細邊框輸入框樣式。課堂案例：特殊樣式[5分鐘]講解要點：無下劃線的超倆鏈接的制作方法。課堂案例：課堂練習2[10分鐘]編寫如下圖所示效果對應的HTML代碼制作圖片按鈕[10分鐘]講解要點：圖片按鈕的制作方法。課堂案例：三類樣式的應用場合[15分鐘]講解要點：其他參考資料對三類樣式的稱呼可能不一樣，例如有的稱為“內嵌（即行內樣式）”、“內部（內嵌樣式）”、“外部（外部樣式）”樣式表。如果希望本網頁內的所有同類標簽都采用統(tǒng)一樣式，這時應采用內嵌樣式。如果希望某段文字和其他段落文字顯示風格不一樣，使用行內（嵌入）樣式表可以解決如果希望一個網站中多個頁面的樣式保持一致，使用外部樣式表文件樣式表可以解決總結[5分鐘]方框屬性有哪些常用屬性？并分別說明其含義？超鏈接樣式有哪幾種？內嵌樣式表、行內樣式表、外部樣式表文件分別適用什么場合？作業(yè)布置參考答案：<HTML><HEAD><METAhttp-equiv="Content-Type"content="text/html;charset=gb2312"><TITLE>外部樣式表練習</TITLE><LINKrel="stylesheet"type="text/css"href="css.css"></HEAD><BODY><FORM><TABLE><TR><TDcolspan="2"><IMGsrc="images/top.jpg"></TD></TR><TR><TDwidth="498"><TABLEwidth="381"cellpadding="0"cellspacing="0"class="loginMain"><TR><TDcolspan="2"height="27"class="loginHead">拍拍用戶登陸</TD></TR><TR><TDwidth="120"class="lefttd">QQ號碼</TD><TDwidth="265"><INPUTtype="text"class="inputMain"> <Ahref="#">忘記QQ號碼>></A></TD></TR><TR><TDclass="lefttd">QQ密碼</TD><TD><INPUTtype="text"class="inputMain"> <Ahref="#">忘記密碼>></A></TD></TR><TR><TDcolspan="2"align="center"><INPUTtype="submit"value=""class="picButton"></TD></TR></TABLE></TD><TD

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論