【正文】 性 ★ 使用該標(biāo)記會輸出一個空行 ,使后繼內(nèi)容隔一行 顯示 ★ P可強制換行 (換行且加入一個空行 ) ★ 用 P/P將段落包圍起來表示一個塊 【舉例】 P標(biāo)記 預(yù)定格式標(biāo)記 格式： PRE…/PRE 功能：在瀏覽器中顯示時，按照文檔中預(yù)先排好的 形式顯示內(nèi)容 第 2章 HTML語言基礎(chǔ) 第 2章目錄 說明： HTML本身會忽略多余的空白和多余的行 ,而 PRE會按照用戶輸入格式排列 ,不會忽略多余的行和列。 注意： ◆ PRE有屬性 width,它表示一行最大長度 ◆ 在使用 PRE時，盡量不要使用水平制表符 【舉例 2－ 2】 分區(qū)顯示標(biāo)記 格式： DIV…/DIV 功能：分區(qū)顯示文檔 (布局 ) 第 2章 HTML語言基礎(chǔ) 第 2章目錄 說明：在一個文本塊或許多段落中設(shè)置布局 (對齊 ) 方式，經(jīng)常使用 DIV， 它可以將文檔內(nèi)容分成區(qū)塊一次 性地布局 注意： ★ 若單個 align屬性出現(xiàn)在 DIV內(nèi)的標(biāo)題或段 落中 ,這些值將使全局變量 DIV的設(shè)置無效 ★ DIV不是段落類型，故 DIV應(yīng)與其它標(biāo)記配 合使用 (如 P、 Hn、 UL、 BLOCKQUOTE等 ) ★ 也可以用 CENTER代替 DIV 【舉例】 DIV標(biāo)記 第 2章 HTML語言基礎(chǔ) 第 2章目錄 強制換行標(biāo)記 格式： Br 功能：強制進(jìn)行換行 說明： BR可放在一行的末尾，使后面的文字、圖片、 表格等在下一行顯示 注意： ◆ BR標(biāo)記 在行與行之間不會產(chǎn)生空行 ◆ NOBR…/NOBR表示不換行 【舉例】 Br標(biāo)記 第 2章 HTML語言基礎(chǔ) 第 2章目錄 插入水平線標(biāo)記 格式： Hr 功能：插入一條水平線 說明 :◆ Hr標(biāo)記也叫水平標(biāo)尺線，可分割不同的內(nèi)容 ◆ Hr有 align、 size、 width、 color、 noshade等屬性 ● align:線的對齊方式，取值為 left、 center或 right。 ● color:指定線的顏色。 ● noshade:若指定該項，則顯示一條無陰影的實線。 ● size:指定線的寬度，以像素為單位。 ● width:指定線的長度，單位可以是像素 【舉例】 Hr標(biāo)記 第 2章 HTML語言基礎(chǔ) 注釋標(biāo)記 格式 :!注釋內(nèi)容 功能 :提供注釋功能 說明 :由注釋標(biāo)記標(biāo)出的文字 ,當(dāng)瀏覽器不能識別時 瀏覽器不作任何顯示 。若是瀏覽器可識別的語句則會在瀏 覽器中執(zhí)行 【舉例 2－ 3】綜合舉例 第 2章目錄 第 2章 HTML語言基礎(chǔ) 標(biāo)題標(biāo)記 Hn 格式： H1…/H1,H2…/H2,…,H6…/H6 功能：設(shè)置各種標(biāo)題的標(biāo)記 說明：標(biāo)題是一段文字的核心內(nèi)容，一般采用加強 的效果顯示 注意： ★ 標(biāo)題標(biāo)記的字體默認(rèn)為黑體 ★ 標(biāo)題號越小，字體越大 ★ 標(biāo)題標(biāo)記可以帶有對齊屬性 ★ 標(biāo)題中無法使用不同大小的字體 三 、 文本標(biāo)記 【舉例】標(biāo)題標(biāo)記 第 2章目錄 第 2章 HTML語言基礎(chǔ) 字體設(shè)置標(biāo)記 格式： FONT…/FONT 功能：設(shè)置字體格式標(biāo)記 說明： FONT提供了以下三種屬性文本的字體、 字號和顏色 size:字體的大小 ,范圍 17，默認(rèn)是 3 (7最大 ) face:設(shè)置字體 ,如宋體、楷體、黑體、隸書等 color:設(shè)置字體顏色。 注意： FONT與 Hn不同 ,FONT用于一般文 本 ,Hn則用于標(biāo)題且數(shù)字所代表的字體不同 第 2章目錄 第 2章 HTML語言基礎(chǔ) 其他標(biāo)記 還有一些標(biāo)記可以改變字體的效果。 B/B 使文本以黑體字的形式輸出 I/I 使文本以斜體字的形式輸出 U/U 使文本以下加一劃線的形式輸出 Cite/Cite 輸出引用方式的字體，通常是斜體 Strong/Strong 輸出加重文本，通常是斜體 加黑體 【舉例 2－ 4】文本標(biāo)記綜合示例 第 2章目錄 第 2章 HTML語言基礎(chǔ) 四 、 列表格式標(biāo)記 有序列表 格式： OL type=“符號類型” LI type=“符號類型” ……/LI LI type=“符號類型” ……/LI …… /OL 功能：建立有序列表 說明 :◆ OL的作用是建立有序列表， LI/LI的 作用是建立列表項 (必選標(biāo)記 ) ◆ 順序號種類由 type屬性 設(shè)置，且它們都是加重符號，默認(rèn)序號是數(shù)字。 第 2章目錄 第 2章 HTML語言基礎(chǔ) 順序號的種類： 數(shù)字 (1,2,3,…)、大寫英文字母 (A,B,C,…)小寫英文字 母 (a,b,c,…)、 大小寫羅馬字母 (I,II,i,ii…) 無序列表 格式： UL type=“符號類型” LI type=“符號類型” …/LI LI type=“符號類型” …/LI …… /UL 功能：建立無序列表 第 2章目錄 第 2章 HTML語言基礎(chǔ) 無序列表中的 type屬性可以是： disc(實心圓點 )、 circle(空心圓點 )、 square(方塊 )、 自定義圖片。默認(rèn)為實心圓點。 【舉例 2－ 5】列表標(biāo)記的使用示例 自定義列表 DL DT…/DT DD…/DD DT…/DT DD…/DD …… /DL 第 2章目錄 第 2章 HTML語言基礎(chǔ) 功能：建立無序列表 (DT表示項目 ,DD表示項目內(nèi) 容 ) 【舉例】自定義列表標(biāo)記 列表制作準(zhǔn)則 ?項目不要太多； ?項目要簡短易懂，能抓住重點； ?需要時，可以混合使用各種列表； ?創(chuàng)建嵌套列表時，遵循由內(nèi)到外，或由外到內(nèi)的 思路。 第 2章目錄 第 2章 HTML語言基礎(chǔ) 五 、 圖像標(biāo)記 插入圖像標(biāo)記 格式： Img……/Img 功能：在網(wǎng)頁中插入圖像 說明： Img標(biāo)記并不是真正地把圖像給加入到 HTML文檔中，它實際上就是通過路徑將圖形文件嵌入 到文檔中。 插入圖像時有多個屬性，具體見 附表 插入視頻 插入視頻和動畫時，含有的屬性見 附表 【舉例 2－ 6】插入圖像 【舉例 5】插入視頻 第 2章目錄 第 2章 HTML語言基礎(chǔ) 六 、 超鏈接標(biāo)記 鏈接－當(dāng)前頁面與其他相關(guān)頁面間的聯(lián)結(jié)關(guān)系；鏈 接的目標(biāo)可以是任何圖像和文件。若瀏覽器能識別就顯 示，不能識別就下載 格式： A…/A 功能：在當(dāng)前頁面和其他頁面間建立鏈接。 主要屬性見 附表 。 【舉例 2－ 7】超級鏈接 第 2章目錄 第 2章 HTML語言基礎(chǔ) 七 、 表格標(biāo)記 表格是高級 HTML構(gòu)造，它是表現(xiàn)力相當(dāng)豐富的標(biāo) 記，它允許用戶在單元格內(nèi)安排文本、圖像及其它 HTML內(nèi)容 表格的組成部分 ◆ 標(biāo)題指明表格的內(nèi)容，它是可選項。 ◆ 表頭標(biāo)注了行或列，通常用大的或加重的字體 ◆ 數(shù)據(jù)是表的內(nèi)容，表頭和數(shù)據(jù)合起來構(gòu)成表格 ◆ 單元格是表中獨立的方塊，單元格可以嵌套表格 第 2章目錄 第 2章 HTML語言基礎(chǔ) 建立表格標(biāo)記 格式： TABLE……/TABLE 功能：創(chuàng)建表格進(jìn)行頁面設(shè)計。表格的整體外觀由 TABLE標(biāo)記的 屬性 設(shè)定 定義表格行標(biāo)記 格式： Tr……/Tr 功能：定義表格中的一行。 說明：此標(biāo)記只能放在 Table標(biāo)記內(nèi)部使用，而 在此標(biāo)記對之間加入文本將是無用的，因為在 Tr /Tr之間只能緊跟 Td/Td標(biāo)記對才是有效的語法。 第 2章目錄 第 2章 HTML語言基礎(chǔ) TR行的屬性： bgcolor :設(shè)置行背景顏色 align: 設(shè)置行對齊方式 vlign: 設(shè)置單元格垂直對齊方式 定義表格單元格標(biāo)記 格式： Td……/Td 功能： 定義表格中的一個數(shù)據(jù)單元格 。 TD、 TH單元格屬性： 增加： rowspan: 設(shè)置單元格所占行數(shù) coospan: 設(shè)置單元格所占列數(shù) width: 設(shè)置單元格寬度 height: 設(shè)置單元格高度 【舉例 28】表格 第 2章目錄 第 2章 HTML語言基礎(chǔ) 167。 表單結(jié)構(gòu) 一 、 表單的概念 表單 :網(wǎng)頁上具有可輸入表項以及項目選擇等控制所 組成的欄目 表單的作用 : 它是用戶與 Web應(yīng)用程序、 Web數(shù)據(jù) 庫等交互的界面 【 表單控件示例 】 表單中常用的標(biāo)記有： FORM、 INPUT、 SELECT、 OPTION TEXTAREA、 BUTTON等 第 2章目錄 第 2章 HTML語言基礎(chǔ) 二 、 表單中常用標(biāo)記 表單標(biāo)記 格式： Form……/Form 功能：創(chuàng)建一個表單。設(shè)置表單的起止位置，指定 處理表單數(shù)據(jù)的程序的 URL地址。 主要屬性： ◆ action：指定接受表單數(shù)據(jù)的服務(wù)器的 URL。 它可以是 CGI、 ASP、 JSP、 PHP等程序 FORM action=“ FORM action=“mailto:” ◆ method: 指定發(fā)送表單數(shù)據(jù)的方法。分為 get (默認(rèn) ) 和 post兩種形式 第 2章目錄 第 2章 HTML語言基礎(chǔ) get方式 :將 FORM的輸入信息作為字符串附加到服務(wù) 器的 URL后面。信息量受限制且不能含有非 ASCII 碼 post方式 ：將 FORM的輸入信息進(jìn)行包裝后發(fā)送 , 其 傳送的信息量沒有限制。 服務(wù)端接受數(shù)據(jù)的方法： % VALUE =(“FormField”) % ◆ target： 指明目標(biāo)窗口或目標(biāo)幀。其值為 :_blank, _parent,_self,_top。 它要與 FRAME配合使用。 第 2章目錄 第 2章 HTML語言基礎(chǔ) 單行輸入標(biāo)記： 格式： INPUT 功能：單一標(biāo)記，設(shè)計表單中提供給用戶的輸入形 式 根據(jù)輸入標(biāo)記的種類不同，其 INPUT標(biāo)記使用的屬 性也不同。 INPUT屬性表 各種輸入域的用法 第 2章目錄 第 2章 HTML語言基礎(chǔ) 多行輸入域標(biāo)記 格式： TEXTAREA……/TEXTAREA 功能：定義多行文本輸入域 主要具有 name、 cols、 rows三個屬性 name: 文本框名稱 cols: 寬度 (字符數(shù) ) rows: 高度 (行數(shù) ) wrap: 換行控制 (off、 hard、 soft) 【 多行輸入域示例 】 各種輸入域的用法 第 2章目錄 第 2章 HTML語言基礎(chǔ) 選擇標(biāo)記 格式