1、第2章,HTML 基礎,本課教學內容,靜態(tài)網(wǎng)頁制作HTML中的常見標簽表格標簽鏈接和圖片標簽表單標簽框架,靜態(tài)網(wǎng)頁制作,HTML 簡介 HTML（HyperText Mark-up Language，超文本標記語言），是構成網(wǎng)頁文檔的主要語言。一般情況下，網(wǎng)頁上看到的文字、圖形、動畫、聲音、表格、鏈接等元素大部分都是由 HTML語言描述的,靜態(tài)網(wǎng)頁制作,HTML 簡介 HTML 語言的基本組成部分是各種標簽，一張生動的網(wǎng)

2、頁往往含有大量的標簽。使用標簽，實際上就是采用一系列指令符號來控制輸出的效果，如：，是最常使用的控制格式的標簽，它表示在網(wǎng)頁上換行,靜態(tài)網(wǎng)頁制作,HTML 簡介HTML 有兩種類型的標簽，一類是單標簽，就是一種單標簽，它只需要單獨一組符號就可以表示完整的功能。另一種是雙標簽，形如內容，表示將"內容"顯示為粗體，這種標簽所圍繞的內容就是標簽作用的作用域,靜態(tài)網(wǎng)頁制作,HTML 簡介HTML 語言對于大小寫不敏感，

3、比如馬上將要學習的表示 HTML 文檔的標簽：，也可寫做，甚至可以寫為，但是一般推薦，自始至終使用同一種書寫方式,HTML 文檔的基本結構,HTML 文檔的基本結構如下： 頭部信息 主體 ,firstPage.html,HTML 中的常見標簽,文字布局及字體標簽 標題、換行、段落標簽是水平線段標簽，此標簽較為常用的屬性有： size：水平線的寬度，單位為像素 width：水

4、平線的長，如不設置則默認為頁面長度，單位默認為像素，但也可以使用百分制，如 width=50%表示長度為頁面長度的 50%,HTML 中的常見標簽,文字布局及字體標簽 標題、換行、段落標簽是水平線段標簽，此標簽較為常用的屬性有： align：水平線的對齊方式，常用的有 left，center，right。 noshade：線段無陰影屬性，沒有屬性值，若設置，則線段為實心線段 color：線段內部的顏色,hr.html,HTML

5、 中的常見標簽,文字布局及字體標簽 文字設計標簽size：用來設置字體大小，它的屬性值有兩種寫法：一種為 size=X，其中 X 為從 1 到 7，值越大，字體越大，屬性值為 3 是客戶端網(wǎng)頁的默認字體大??；另一種方法是 size=+X 或-X，X 同樣為從 1 到 7 的值，意思是以基準字體大小為標準大 X 號字體或者小 X 號字體,HTML 中的常見標簽,文字布局及字體標簽 文字設計標簽face：用來設置字體類型，默認為宋體

6、。如，即設置該內容的輸出的字體為楷體但是需要注意的是，只有電腦中安裝的字體才可以在瀏覽器中出現(xiàn)相應風格，如果用戶沒有安裝該字體，則會顯示默認字體的風格 color：用于設置字體顏色,font.html,HTML 中的常見標簽,文字布局及字體標簽 文字設計標簽常見的設置文字風格的標簽有： 內容：將內容設置為粗體。 內容：將內容設置下劃線。 內容：將內容設置為斜體。 內容：將內容設置為上標。 內容：將內容設置為下標,styl

7、e.html,列表標簽,列表標簽分為兩種，一種是有序的，一種是無序的。內容，表示它所包圍的內容是無序列表標簽，即列表中每一項目前不會加上序號，而是會加上●、○、■等符號。內容表示有序標簽，意義與使用方法和無序列表標簽大致相同，不同點為它會在每個列表項前加上數(shù)字用 列表項 標示。,list.html,表格標簽,表格基本設計編寫表格所用到的標簽如下： ：定義表格，表格的所有內容都寫在這個標簽之內 ：定義標題，標題會自動出現(xiàn)在整

8、張表格的上方：定義表行 ：定義表頭，包含在之間，表頭中的文字會自動變成粗體 ：定義表元(表格的具體數(shù)據(jù))，包含在之間,table1.html,表格標簽,以下為制作表格的標簽中大多擁有的公共屬性： align：水平布局方式，常用屬性值有 left，right，center，表示左對齊，右對齊和居中對齊，的該屬性表示表格在頁面的布局方式，、的該屬性表示該行和該表元內的內容的布局方式。默認布局方式為左對齊 bgcolor：設置背景顏

9、色 border：設置邊框的寬度，屬性值為整數(shù)，為 0 時表格沒有邊框，默認值為 0 width：寬度，默認單位為像素，也可以使用百分制單位 height：高度，默認單位為像素；也可以使用百分制單位,table2.html,表格標簽,對于整張表格，標簽常用的屬性有以下幾個： bordercolor：表格邊框的顏色，默認為黑色 cellpadding：表元邊框的寬度 cellspacing：表元的邊框與表格邊框之間的寬度,ta

10、ble3.html,合并單元格,合并單元格必須對標簽中的 rowspan、colspan 進行設置，屬性值都為整數(shù)，默認為 1，表示沒有合并。這兩個屬性的意思分別為：從該表元起，該表元在行或者列上占有的單 元格數(shù)，比如設置某個標簽rowspan=2，表示該表元及其下面的表元合并成一個,table4.html,鏈接和圖片標簽,鏈接標簽可以使用戶鏈接到另一個頁面，它的寫法是內容，標簽內的內容為鏈接所顯示的內容，可以是文字、空格占位符、圖片等

11、，此標簽的一個重要屬性是：href，它的值表示鏈接所指向的資源地址,href1.html,鏈接和圖片標簽,圖片標簽比較重要和常用的標簽有以下幾個： src：表示圖片儲存的位置 width，height，border，align：作用與前文所提到屬性相同 alt：當圖片未載入或者載入失敗時提供的替代性的文字說明,img.html,表單標簽,type 可以為以下的值： text：文本框，text 也為 type 的默認屬性pass

12、word：密碼框 radio：單選按鈕，可以將多個單選按鈕的 name 屬性設置相同，使其成為一組。checked屬性可設置默認被選 checkbox：復選框，checked 屬性可設置默認被選,表單標簽,reset：重置按鈕，按下之后，所有的表單元素內容變?yōu)槟J值 button：普通按鈕 submit：提交按鈕，按下之后，網(wǎng)頁會將表單的內容提交給 action 設定的網(wǎng)頁，action的值為空時提交給本頁 image：圖