1、a,1,HTML語(yǔ)言,a,2,目標(biāo),描述 HTML 文檔的結(jié)構(gòu) 使用基本的 HTML 標(biāo)簽 在 HTML 文檔中插入特殊字符 在 HTML 文檔中創(chuàng)建超級(jí)鏈接,a,3,HTML 簡(jiǎn)介,超文本,提供鏈接到其他頁(yè)面或同一頁(yè)面的其他位置的文本,標(biāo)記,可以用標(biāo)簽標(biāo)記頁(yè)面的不同部分以正確顯示,語(yǔ)言,HTML 可用于： 控制頁(yè)面和內(nèi)容的外觀 發(fā)布和檢索聯(lián)機(jī)文檔 創(chuàng)建聯(lián)機(jī)表單 插入諸如音頻剪輯和視頻剪輯等對(duì)象,a,4,HTML 文檔示例, 學(xué)習(xí) HTML 歡迎來(lái)到 HTML 世界 ,HTML 代碼,瀏覽器處理代碼并進(jìn)行顯示,a,5,編輯器和瀏覽器, 學(xué)習(xí) HTML 歡迎來(lái)到 HTML 世界 ,HTML 代碼

2、,在編輯器中編寫(xiě) HTML 代碼,瀏覽器顯示 HTML 文檔/頁(yè)面,a,6,編輯器 2-2,需要在編輯器中鍵入源代碼,示例：DreamWeaver,Macromedia Dreamweaver 是一種專業(yè)的 HTML 編輯器，用于設(shè)計(jì)、編碼、開(kāi)發(fā)網(wǎng)站、網(wǎng)頁(yè)和強(qiáng)大的 Web 應(yīng)用程序。,a,7,HTML 文檔結(jié)構(gòu), 學(xué)習(xí) HTML 歡迎來(lái)到 HTML 世界 ,HTML 網(wǎng)頁(yè),頭部部分,主體部分,標(biāo)簽標(biāo)記 HTML 文檔的開(kāi)始和結(jié)束,這部分包括標(biāo)題和其他說(shuō)明信息。包括在 標(biāo)簽內(nèi),這部分包含文本、圖像和鏈接。它包括在 標(biāo)簽內(nèi),a,8,HTML 標(biāo)簽 2-2, 學(xué)習(xí) HTML 歡迎來(lái)到 HTML 世界

3、 ,標(biāo)簽,標(biāo)識(shí) BODY 元素,屬性,提供有關(guān)元素的附加信息,值,分配給屬性的內(nèi)容,a,9,META 標(biāo)簽 2-1,META 標(biāo)簽是一個(gè)特殊的 HTML 標(biāo)簽，提供有關(guān)網(wǎng)頁(yè)的信息，如作者姓名、公司名稱和聯(lián)系信息等 許多搜索引擎都使用 META 標(biāo)簽信息 例如，要將 Graham Browne 指定為作者，則使用以下 META 標(biāo)簽：,a,10,META 標(biāo)簽 2-2,http-equiv 屬性可用來(lái)代替 META 標(biāo)簽中的 name 屬性,表示有效期：格林尼治標(biāo)準(zhǔn)時(shí)間 2005 年 9 月 12 日，星期一 14:25:27,表示每隔2秒，自動(dòng)刷新網(wǎng)頁(yè),演示：自動(dòng)刷新的例子,a,11,HTML

4、 基本元素,標(biāo)題 段落 換行符 預(yù)先格式化 字符格式化 列表 水平線 字體 圖像 特殊字符 超級(jí)鏈接,a,12,標(biāo)題, 動(dòng)物世界 從大自然獲得靈感 從大自然獲得靈感 從大自然獲得靈感 從大自然獲得靈感 從大自然獲得靈感 從大自然獲得靈感 ,H1 到 H6 標(biāo)簽用于指定不同級(jí)別的標(biāo)題,a,13,段落標(biāo)簽, 詩(shī)詞學(xué)習(xí) 我是第一段 我是第二段 左對(duì)齊顯示 居中顯示 右對(duì)齊顯示 , 標(biāo)簽用于標(biāo)記段落,a,14,換行符,只要在文本中放入 標(biāo)簽，就會(huì)強(qiáng)制換行, 詩(shī)詞學(xué)習(xí) 我是第一行我是第二行 我是第一段 我是第二段 ,a,15, 標(biāo)簽, 詩(shī)詞學(xué)習(xí) 靜夜思 床前明月光 疑是地上霜 舉頭望明月 低頭思故鄉(xiāng) 俺

5、是超鏈接，移過(guò)來(lái)我就顯示下劃線 ,內(nèi)嵌樣式-6 特殊的選擇器,HTML選擇器,特殊的偽類：A代表超鏈接，hover代表鼠標(biāo)懸停,a,70,外部樣式,根據(jù)樣式文件與網(wǎng)頁(yè)的關(guān)聯(lián)方式又分為： 鏈接（LINK ）外部樣式表 導(dǎo)入（import）外部樣式表,樣式文件 P . ,網(wǎng)頁(yè)2,網(wǎng)頁(yè)3,網(wǎng)頁(yè)1,a,71,鏈接外部樣式表,使用LINK（鏈接）標(biāo)簽 ，語(yǔ)法： ,第一步：創(chuàng)建樣式表文件newstyle.css,第二步：把樣式文件和網(wǎng)頁(yè)關(guān)聯(lián),樣式文件： newstyle.css P . ,Onel.htm,another.htm,第三步：瀏覽查看各網(wǎng)頁(yè),演示：鏈接樣式表示例,a,72,導(dǎo)入外部樣式表,使用

6、import導(dǎo)入 ，語(yǔ)法： import 樣式表文件.css; ,操作步驟同鏈接樣式表,a,73,外部樣式文件,樣式的混合使用,行內(nèi)樣式表、內(nèi)嵌樣式表、外部樣式表各有優(yōu)勢(shì)，實(shí)際的開(kāi)發(fā)中常常 需要混合使用： 有關(guān)整個(gè)網(wǎng)站統(tǒng)一風(fēng)格的樣式代碼，放置在獨(dú)立的樣式文件*.css 某些樣式不同的頁(yè)面，除了鏈接外部樣式文件，還需定義內(nèi)嵌樣式 某張網(wǎng)頁(yè)內(nèi)，部分內(nèi)容”與眾不同“，采用行內(nèi)樣式,對(duì)于某個(gè)HTML標(biāo)簽： 1）如果有多種樣式，如果規(guī)定的樣式?jīng)]有沖突，則疊加； 2）如果有沖突，則最先考慮行內(nèi)樣式表顯示，如果沒(méi)有，再考慮內(nèi)嵌樣式顯示，如果還沒(méi)有，最后采用外面樣式表顯示，否則就按HTML的默認(rèn)樣式顯示；,內(nèi)

7、嵌樣式,行內(nèi)樣式,某個(gè)HTML標(biāo)簽,a,74, 層標(biāo)簽,關(guān)鍵代碼 Z-index=1，我是第一層，我是容器，包含圖片段落 Z-index=2，我是第二層，包含圖片和段落 ,使用 Z index指定是哪一層,是塊級(jí)容器標(biāo)簽，可以包含圖片、標(biāo)題、段落、文字等,圖片,段落,top,left,a,75, 標(biāo)簽, 所有韓款童裝10元/件起拍嘍 ,是行級(jí)容器標(biāo)簽，不可以包含圖片、標(biāo)題、段落等，只能包含文字內(nèi)容,a,76,CSS 的優(yōu)點(diǎn),改變?yōu)g覽器的默認(rèn)顯示風(fēng)格 頁(yè)面內(nèi)容和顯示樣式分離 可以重用樣式表 方便網(wǎng)站維護(hù),a,77,總結(jié),DHTML 是網(wǎng)頁(yè)中 HTML、樣式表和腳本的組合應(yīng)用程序，增強(qiáng)網(wǎng)頁(yè)的交互性 樣式分為行