這是html教學(xué)ppt，包括了知識要點(diǎn)，什么是 HTML？HTML文檔的結(jié)構(gòu)，設(shè)置文本格式，使用圖像，使用字幕和背景音樂，使用超鏈接，使用表單，課堂作業(yè)等內(nèi)容，歡迎點(diǎn)擊下載。
html教學(xué)ppt是由紅軟PPT免費(fèi)下載網(wǎng)推薦的一款課件PPT類型的PowerPoint.
知識要點(diǎn)： 基本的HTML語法結(jié)構(gòu) 常用的HTML 標(biāo)記的使用 HTML 文檔 = 網(wǎng)頁 HTML 文檔描述網(wǎng)頁 HTML 文檔包含 HTML 標(biāo)簽和純文本 HTML 文檔也被稱為網(wǎng)頁 Web 瀏覽器的作用是讀取 HTML 文檔，并以網(wǎng)頁的形式顯示出它們。瀏覽器不會顯示 HTML 標(biāo)簽，而是使用標(biāo)簽來解釋頁面的內(nèi)容 1.什么是 HTML？ HTML 是用來描述網(wǎng)頁的一種語言。 HTML 指的是超文本標(biāo)記語言 (Hyper Text Markup Language) HTML 不是一種編程語言，而是一種標(biāo)記語言 (markup language) 標(biāo)記語言是一套標(biāo)記標(biāo)簽 (markup tag) HTML 使用標(biāo)記標(biāo)簽來描述網(wǎng)頁 HTML 標(biāo)簽 HTML 標(biāo)記標(biāo)簽通常被稱為 HTML 標(biāo)簽 (HTML tag)。 HTML 標(biāo)簽是由尖括號包圍的關(guān)鍵詞，比如 HTML 標(biāo)簽通常是成對出現(xiàn)的，比如 和 標(biāo)簽對中的第一個標(biāo)簽是開始標(biāo)簽，第二個標(biāo)簽是結(jié)束標(biāo)簽 開始和結(jié)束標(biāo)簽也被稱為開放標(biāo)簽和閉合標(biāo)簽 2. HTML文檔的結(jié)構(gòu) 2.1.1 標(biāo)記基礎(chǔ) 1. 基本的HTML語法 (1) 在HTML語言中，所有的標(biāo)記都必須用尖括號（即小于號“<”和大于號“>”）括起來。例如，、、等。 (2) 大部分標(biāo)記都是成對出現(xiàn)的，包括開始標(biāo)記和結(jié)束標(biāo)記，開始標(biāo)記和相應(yīng)的結(jié)束標(biāo)記定義了標(biāo)記所影響的范圍；結(jié)束標(biāo)記與開始標(biāo)記名稱相同，但結(jié)束標(biāo)記總是以一個斜線符號開頭的。例如，和、和等。 (3) HTML標(biāo)記不區(qū)分大小寫，但通常約定使用大寫字母來表示，以利于HTML文檔的維護(hù)。 2. 標(biāo)記符的屬性 大多數(shù)標(biāo)記都擁有一個屬性集，通過這些屬性可以對作用的內(nèi)容進(jìn)行更多的控制。在HTML語言中，所有屬性都放置在開始標(biāo)記的尖括號內(nèi)。 心想事成。 2.1.2 HTML文檔的基本結(jié)構(gòu) 一個基本的HTML文檔通常包含3對頂級標(biāo)記 HTML標(biāo)記 …是全部文檔內(nèi)容的標(biāo)記，分別在網(wǎng)頁的第一個標(biāo)記和最后一個標(biāo)記，其他所有的代碼都位于這兩個標(biāo)記之間�？蛇x的。 首部標(biāo)記 … 用語提供與WEB頁相關(guān)的各種信息。
標(biāo)記指定網(wǎng)頁的標(biāo)題 正文標(biāo)記 .. 標(biāo)記包含了文檔的內(nèi)容，網(wǎng)頁中的文字、圖像、動畫、超鏈接以及其他的HTML元素均位于該標(biāo)記中。
文本、圖像、動畫、HTML其它元素等 實(shí)例2.1利用HTML標(biāo)記、首部標(biāo)記和正文標(biāo)記，在記事本（或在DeamweaverMX2004的代碼編寫窗口）中編寫一個簡單的HTML文檔，將文件名指定為2-01.htm，并保存在CH1目錄下。圖2-2 第一個網(wǎng)頁的效果 ------2-01.htm------
萬丈高樓平地起，制作網(wǎng)頁剛開始。 2.2 設(shè)置文本格式 2.2.1 分段與換行 分段標(biāo)記
X2l紅軟基地
換行標(biāo)記X2l紅軟基地
X2l紅軟基地
高樓萬丈平地起，X2l紅軟基地
蟠龍臥虎高山頂，X2l紅軟基地
邊區(qū)的太陽紅又紅，X2l紅軟基地 其中n的取值是1－6 實(shí)例2.3 演示各種標(biāo)題標(biāo)記的使用方法，源代碼如下：圖2-4 各種標(biāo)題標(biāo)記效果 ------ 2-03.htm ------
這是一級標(biāo)題（最大）
這是二級標(biāo)題
這是三級標(biāo)題
這是四級標(biāo)題
這是五級標(biāo)題
這是六級標(biāo)題（最�。�
這是普通文字。X2l紅軟基地
4. 水平線標(biāo)記…X2l紅軟基地
、標(biāo)題標(biāo)記… 以及水平線標(biāo)記這是左對齊的效果。X2l紅軟基地
這是居中對齊的效果。X2l紅軟基地
這是右對齊的效果。X2l紅軟基地
春夜喜雨
圖2-6 段落對齊效果
春眠不覺曉，處處聞啼鳥。X2l紅軟基地
夜來風(fēng)雨聲，花落知多少。X2l紅軟基地
2.2.3 設(shè)置字體、字號和顏色 在HTML語言中，可以使用字體標(biāo)記… 來設(shè)置文本的字符格式，為此可以將文本置于和 標(biāo)記之間，并通過FACE、SIZE和COLOR屬性來設(shè)置文本的字體、字號和顏色。FACE屬性指定一種字體，例如： 超文本標(biāo)記語言 ASP動態(tài)網(wǎng)頁設(shè)計(jì) COLOR屬性指定文本的顏色，可以用顏色名稱表示，也可以用十六進(jìn)制RGB格式表示。例如： 超文本標(biāo)記語言 電子商務(wù)網(wǎng)頁設(shè)計(jì) 2.2.4 設(shè)置字符樣式 通過設(shè)置字符樣式可以為某些字符設(shè)置特殊格式，例如粗體、斜體、下劃線、刪除線、上標(biāo)、下標(biāo)等。常用的設(shè)置字符樣式的標(biāo)記如下： … 粗體 … 大字體 … 斜體 … 刪除線 … 小字體 … 刪除線 … 上標(biāo) … 下標(biāo) … 固定寬度字體 … 下劃線 實(shí)例2.7 使用各種標(biāo)記來設(shè)置字符的樣式，源代碼如下所示： -- 2-07.htm ------
粗體字：電子商務(wù)網(wǎng)頁設(shè)計(jì) X2l紅軟基地
大字體：電子商務(wù)網(wǎng)頁設(shè)計(jì) X2l紅軟基地
斜體字：電子商務(wù)網(wǎng)頁設(shè)計(jì) X2l紅軟基地
上標(biāo)示例： a2 +b2 =c2 X2l紅軟基地
下標(biāo)示例：H2 SO4 X2l紅軟基地
2.3 使用圖像 2.3.1插入圖像標(biāo)記美麗的海濱城市---青島 播放多媒體文件
標(biāo)記格式：要滾動顯示的文本信息 MARQUEE標(biāo)記的主要屬性有： (1) ALIGN：指定字幕與周圍文本的對齊方式，其取值可以是top、middle或bottom。 (2) BEHAVIOR：指定文本動畫的類型，其取值可以是scroll、slide或alternate。 (3) BGCOLOR：指定字幕的背景顏色。 (4) DIRECTION：指定文本的移動方向，其取值可以是down、left、right或up。 (5) HEIGHT：指定字幕的高度，以像素或百分比為單位。 (6) HSPACE：整數(shù)，指定字幕的外部邊緣與瀏覽器窗口之間的左右邊距（像素）。 (7) LOOP：指定字幕的滾動次數(shù)。 (8) SCROLLAMOUNT：整數(shù)，指定字幕文本每次移動的距離，以像素為單位。 (9) SCROLLDEALY：整數(shù)，指定與前段字幕文本延遲多少ms后重新開始移動文本。 2. 實(shí)例2.11 在網(wǎng)頁中插入一個字幕，源代碼如下所示：圖2-11 滾動字幕效果
在網(wǎng)頁中插入一個自下而上移動的字幕
月落烏啼霜滿天，X2l紅軟基地 X2l紅軟基地 X2l紅軟基地 2.4.2背景音樂標(biāo)記當(dāng)頁面被打開時，你將會聽到美妙的背景音樂。X2l紅軟基地
2.5 使用表格 1. 格式： ……… …… …
表格標(biāo)題文字
標(biāo)題1
標(biāo)題2
標(biāo)題n
數(shù)據(jù)11
數(shù)據(jù)12
數(shù)據(jù)1n
數(shù)據(jù)21
數(shù)據(jù)22
數(shù)據(jù)2n
數(shù)據(jù)n1
數(shù)據(jù)n2
數(shù)據(jù)nn
實(shí)例2.13 使用HTML語言創(chuàng)建一個基本表格，源代碼如下所示：
創(chuàng)建基本表格
第1列標(biāo)題
第2列標(biāo)題
第3列標(biāo)題
第4列標(biāo)題
春游芳草地
夏賞綠河池
秋飲黃花酒
冬聽白雪詩/TD>
春游芳草地
夏賞綠河池
秋飲黃花酒
冬聽白雪詩
春游芳草地
夏賞綠河池
秋飲黃花酒
冬聽白雪詩
2.6 使用超鏈接 2.6.1 什么是超鏈接 超鏈接是由源端點(diǎn)到目標(biāo)端點(diǎn)的一種跳轉(zhuǎn)。源端點(diǎn)可以是網(wǎng)頁中的一段文本或一幅圖像或一個按鈕等。目標(biāo)端點(diǎn)可以是任意類型的網(wǎng)絡(luò)資源，例如可以是一個網(wǎng)頁、一幅圖像、一首歌曲、一段動畫或一個程序等。 2.6.2 超鏈接標(biāo)記 在HTML語言中，可以使用 標(biāo)記來創(chuàng)建超鏈接，標(biāo)記格式如下： 文本 標(biāo)記的屬性有： (1) HREF：該屬性是必選項(xiàng)，用于指定目標(biāo)端點(diǎn)的URL地址，可以包含一個或多個參數(shù)。 (2) TITLE：該屬性也是可選項(xiàng)，用于指定指向超鏈接時所顯示的標(biāo)題文字。 (3) TARGET：該屬性是可選項(xiàng)，用于指定一個窗口或框架的名稱，目標(biāo)文檔將在該窗口或框架中打開。TARGET屬性的取值 ： “_blank” 指定將鏈接的目標(biāo)文件加載到未命名的新瀏覽器窗口中； “_parent” 指定將鏈接的目標(biāo)文件加載到包含鏈接的父框架頁或窗口中，如果包含鏈接的框架不是嵌套的，則鏈接的目標(biāo)文件加載到整個瀏覽器窗口中； “_self” 指定將鏈接的目標(biāo)文件加載到鏈接所在的同一框架或窗口中； “_top” 指定將鏈接的目標(biāo)文件加載到整個瀏覽器窗口中，并由此刪除所有框架。 實(shí)例2.15 使用 標(biāo)記創(chuàng)建超鏈接，源代碼如下所示： ------ 2-15.htm ------
創(chuàng)建超鏈接示例 X2l紅軟基地
查看圖文繞排效果 X2l紅軟基地
美麗的海邊風(fēng)光 X2l紅軟基地
X2l紅軟基地
2.7 使用表單 什么是表單？表單是用來收集訪問者信息的域集。表單用于用戶收集信息，然后將這些信息提交給服務(wù)器進(jìn)行處理。表單可以包含允許用戶進(jìn)行交互的各種控件，例如文本框、列表框、復(fù)選框和單選按鈕等。
FORM標(biāo)記的常用屬性有： (1) NAME：指定表單的名稱，以標(biāo)識表單。如：NAME = “biao1" 。命名表單后，可以使用腳本語言（如VBScript或JScript）來引用或控制該表單。 (2) METHOD：指定將表單數(shù)據(jù)傳輸?shù)椒⻊?wù)器的方法，其取值可以是： post：在HTTP請求中嵌入表單數(shù)據(jù)。 get：將表單數(shù)據(jù)附加到請求該頁的URL中。 如：METHOD = "post“ （或者 methot=“get”） (3) ACTION：指定將要接收表單數(shù)據(jù)的服務(wù)器端程序或動態(tài)網(wǎng)頁的網(wǎng)址。 如：ACTION = "字符串" (4) onSubmit：指定提交表單時調(diào)用的事件處理程序。 (5) onReset：指定重置表單時調(diào)用的事件處理程序。 (6) TARGET：指定一個目標(biāo)窗口 2.7.2 使用輸入型表單控件 為了讓用戶通過表單輸入數(shù)據(jù)，可以使用換行標(biāo)記X2l紅軟基地
X2l紅軟基地
高樓萬丈平地起，X2l紅軟基地
蟠龍臥虎高山頂，X2l紅軟基地
邊區(qū)的太陽紅又紅，
X2l紅軟基地
邊區(qū)的太陽紅又紅。 3. 標(biāo)題標(biāo)記
其中n的取值是1－6 實(shí)例2.3 演示各種標(biāo)題標(biāo)記的使用方法，源代碼如下：圖2-4 各種標(biāo)題標(biāo)記效果 ------ 2-03.htm ------
這是一級標(biāo)題（最大）
這是二級標(biāo)題
這是三級標(biāo)題
這是四級標(biāo)題
這是五級標(biāo)題
這是六級標(biāo)題（最�。�
這是普通文字。X2l紅軟基地
4. 水平線標(biāo)記…X2l紅軟基地
、標(biāo)題標(biāo)記… 以及水平線標(biāo)記這是左對齊的效果。X2l紅軟基地
這是居中對齊的效果。X2l紅軟基地
這是右對齊的效果。X2l紅軟基地
春夜喜雨
圖2-6 段落對齊效果
春眠不覺曉，處處聞啼鳥。X2l紅軟基地
夜來風(fēng)雨聲，花落知多少。X2l紅軟基地
2.2.3 設(shè)置字體、字號和顏色 在HTML語言中，可以使用字體標(biāo)記… 來設(shè)置文本的字符格式，為此可以將文本置于和 標(biāo)記之間，并通過FACE、SIZE和COLOR屬性來設(shè)置文本的字體、字號和顏色。FACE屬性指定一種字體，例如： 超文本標(biāo)記語言 ASP動態(tài)網(wǎng)頁設(shè)計(jì) COLOR屬性指定文本的顏色，可以用顏色名稱表示，也可以用十六進(jìn)制RGB格式表示。例如： 超文本標(biāo)記語言 電子商務(wù)網(wǎng)頁設(shè)計(jì) 2.2.4 設(shè)置字符樣式 通過設(shè)置字符樣式可以為某些字符設(shè)置特殊格式，例如粗體、斜體、下劃線、刪除線、上標(biāo)、下標(biāo)等。常用的設(shè)置字符樣式的標(biāo)記如下： … 粗體 … 大字體 … 斜體 … 刪除線 … 小字體 … 刪除線 … 上標(biāo) … 下標(biāo) … 固定寬度字體 … 下劃線 實(shí)例2.7 使用各種標(biāo)記來設(shè)置字符的樣式，源代碼如下所示： -- 2-07.htm ------
粗體字：電子商務(wù)網(wǎng)頁設(shè)計(jì) X2l紅軟基地
大字體：電子商務(wù)網(wǎng)頁設(shè)計(jì) X2l紅軟基地
斜體字：電子商務(wù)網(wǎng)頁設(shè)計(jì) X2l紅軟基地
上標(biāo)示例： a2 +b2 =c2 X2l紅軟基地
下標(biāo)示例：H2 SO4 X2l紅軟基地
2.3 使用圖像 2.3.1插入圖像標(biāo)記美麗的海濱城市---青島 播放多媒體文件
標(biāo)記格式：要滾動顯示的文本信息 MARQUEE標(biāo)記的主要屬性有： (1) ALIGN：指定字幕與周圍文本的對齊方式，其取值可以是top、middle或bottom。 (2) BEHAVIOR：指定文本動畫的類型，其取值可以是scroll、slide或alternate。 (3) BGCOLOR：指定字幕的背景顏色。 (4) DIRECTION：指定文本的移動方向，其取值可以是down、left、right或up。 (5) HEIGHT：指定字幕的高度，以像素或百分比為單位。 (6) HSPACE：整數(shù)，指定字幕的外部邊緣與瀏覽器窗口之間的左右邊距（像素）。 (7) LOOP：指定字幕的滾動次數(shù)。 (8) SCROLLAMOUNT：整數(shù)，指定字幕文本每次移動的距離，以像素為單位。 (9) SCROLLDEALY：整數(shù)，指定與前段字幕文本延遲多少ms后重新開始移動文本。 2. 實(shí)例2.11 在網(wǎng)頁中插入一個字幕，源代碼如下所示：圖2-11 滾動字幕效果
在網(wǎng)頁中插入一個自下而上移動的字幕
月落烏啼霜滿天，X2l紅軟基地 X2l紅軟基地 X2l紅軟基地 2.4.2背景音樂標(biāo)記當(dāng)頁面被打開時，你將會聽到美妙的背景音樂。X2l紅軟基地
2.5 使用表格 1. 格式： ……… …… …
表格標(biāo)題文字
標(biāo)題1
標(biāo)題2
標(biāo)題n
數(shù)據(jù)11
數(shù)據(jù)12
數(shù)據(jù)1n
數(shù)據(jù)21
數(shù)據(jù)22
數(shù)據(jù)2n
數(shù)據(jù)n1
數(shù)據(jù)n2
數(shù)據(jù)nn
實(shí)例2.13 使用HTML語言創(chuàng)建一個基本表格，源代碼如下所示：
創(chuàng)建基本表格
第1列標(biāo)題
第2列標(biāo)題
第3列標(biāo)題
第4列標(biāo)題
春游芳草地
夏賞綠河池
秋飲黃花酒
冬聽白雪詩/TD>
春游芳草地
夏賞綠河池
秋飲黃花酒
冬聽白雪詩
春游芳草地
夏賞綠河池
秋飲黃花酒
冬聽白雪詩
2.6 使用超鏈接 2.6.1 什么是超鏈接 超鏈接是由源端點(diǎn)到目標(biāo)端點(diǎn)的一種跳轉(zhuǎn)。源端點(diǎn)可以是網(wǎng)頁中的一段文本或一幅圖像或一個按鈕等。目標(biāo)端點(diǎn)可以是任意類型的網(wǎng)絡(luò)資源，例如可以是一個網(wǎng)頁、一幅圖像、一首歌曲、一段動畫或一個程序等。 2.6.2 超鏈接標(biāo)記 在HTML語言中，可以使用 標(biāo)記來創(chuàng)建超鏈接，標(biāo)記格式如下： 文本 標(biāo)記的屬性有： (1) HREF：該屬性是必選項(xiàng)，用于指定目標(biāo)端點(diǎn)的URL地址，可以包含一個或多個參數(shù)。 (2) TITLE：該屬性也是可選項(xiàng)，用于指定指向超鏈接時所顯示的標(biāo)題文字。 (3) TARGET：該屬性是可選項(xiàng)，用于指定一個窗口或框架的名稱，目標(biāo)文檔將在該窗口或框架中打開。TARGET屬性的取值 ： “_blank” 指定將鏈接的目標(biāo)文件加載到未命名的新瀏覽器窗口中； “_parent” 指定將鏈接的目標(biāo)文件加載到包含鏈接的父框架頁或窗口中，如果包含鏈接的框架不是嵌套的，則鏈接的目標(biāo)文件加載到整個瀏覽器窗口中； “_self” 指定將鏈接的目標(biāo)文件加載到鏈接所在的同一框架或窗口中； “_top” 指定將鏈接的目標(biāo)文件加載到整個瀏覽器窗口中，并由此刪除所有框架。 實(shí)例2.15 使用 標(biāo)記創(chuàng)建超鏈接，源代碼如下所示： ------ 2-15.htm ------
創(chuàng)建超鏈接示例 X2l紅軟基地
查看圖文繞排效果 X2l紅軟基地
美麗的海邊風(fēng)光 X2l紅軟基地
X2l紅軟基地
2.7 使用表單 什么是表單？表單是用來收集訪問者信息的域集。表單用于用戶收集信息，然后將這些信息提交給服務(wù)器進(jìn)行處理。表單可以包含允許用戶進(jìn)行交互的各種控件，例如文本框、列表框、復(fù)選框和單選按鈕等。
FORM標(biāo)記的常用屬性有： (1) NAME：指定表單的名稱，以標(biāo)識表單。如：NAME = “biao1" 。命名表單后，可以使用腳本語言（如VBScript或JScript）來引用或控制該表單。 (2) METHOD：指定將表單數(shù)據(jù)傳輸?shù)椒⻊?wù)器的方法，其取值可以是： post：在HTTP請求中嵌入表單數(shù)據(jù)。 get：將表單數(shù)據(jù)附加到請求該頁的URL中。 如：METHOD = "post“ （或者 methot=“get”） (3) ACTION：指定將要接收表單數(shù)據(jù)的服務(wù)器端程序或動態(tài)網(wǎng)頁的網(wǎng)址。 如：ACTION = "字符串" (4) onSubmit：指定提交表單時調(diào)用的事件處理程序。 (5) onReset：指定重置表單時調(diào)用的事件處理程序。 (6) TARGET：指定一個目標(biāo)窗口 2.7.2 使用輸入型表單控件 為了讓用戶通過表單輸入數(shù)據(jù)，可以使用 X2l紅軟基地
html標(biāo)簽ppt
ppt轉(zhuǎn)換html5
html5 ppt開發(fā)
其中: 圖片可以是*.gif；*.jpg格式的圖片，地址可以是相對地址或絕對的地址。 主要屬性有： Alt： 用于設(shè)置鼠標(biāo)移上去顯示的文本信息。 Hight和Width：用于設(shè)置圖片的高度或?qū)挾取Ｈ鐆idth=200。 Borter：用于設(shè)置圖象邊框的寬度。如Borter=4。 Hspace和Vspace：用于設(shè)置圖片與文本之間的距離。 Align：用于設(shè)置圖文混排時的對齊方式。如align=“right”。 2. 實(shí)例2.8 使用IMG標(biāo)記在網(wǎng)頁中插入一個圖像，源代碼如下所示：圖 2-9 插入圖像效果 ------ 2-8.htm ------
2.3.2 播放多媒體文件 
