HTML學(xué)習(xí)基礎(chǔ)資料(中1)

1、超鏈接的概述超鏈接的概述常見的圖片格式介紹常見的圖片格式介紹圖像類型圖像類型優(yōu)點(diǎn)優(yōu)點(diǎn)缺點(diǎn)缺點(diǎn)適用場合適用場合制作工具制作工具*.jpg體積小，比較清晰體積小，比較清晰有損壓縮有損壓縮 、畫、畫面失真面失真 網(wǎng)頁圖片網(wǎng)頁圖片Photoshop*.gif支持支持 Internet 標(biāo)標(biāo)準(zhǔn)準(zhǔn) ,支持無損耗壓縮支持無損耗壓縮和透明度，很流行和透明度，很流行 支持有限的透支持有限的透明度明度,效果不如效果不如別的圖像別的圖像網(wǎng)頁圖片網(wǎng)頁圖片Photoshop*.swf體積小體積小,便于網(wǎng)絡(luò)傳便于網(wǎng)絡(luò)傳輸輸制作麻煩制作麻煩網(wǎng)頁動畫網(wǎng)頁動畫 Flash*.png支持高級別無損耗支持高級別無損耗壓縮，支持壓縮

2、，支持alpha通道透明度，受最通道透明度，受最新的新的Web瀏覽器支瀏覽器支持持較舊的瀏覽器較舊的瀏覽器不支持不支持PNG文文件件網(wǎng)頁圖片網(wǎng)頁圖片Photoshop*.bmp支持支持 24 位顏色深位顏色深度，兼容性好度，兼容性好不支持壓縮不支持壓縮 容量大容量大桌面墻紙桌面墻紙photoshop圖像的添加圖像的添加語法語法語法解釋語法解釋引用圖片必須用引用圖片必須用元素標(biāo)志。元素標(biāo)志。元元素下的基本元素屬性是素下的基本元素屬性是src屬性，屬性，src的屬性值的屬性值為所引用的圖片的為所引用的圖片的URL地址。地址。src屬性是必須的。屬性是必須的。Src的的URL可以是可以是絕對地絕對地

3、址址，也可以是，也可以是相對地址相對地址。6.1.html設(shè)置圖像屬性設(shè)置圖像屬性 本講大綱：1 1、圖像高度圖像高度heighheigh 支持網(wǎng)站：2 2、圖像寬度圖像寬度widthwidth 3 3、圖像邊框圖像邊框borderborder 4 4、圖像水平間距圖像水平間距hspacehspace 5 5、圖像垂直間距圖像垂直間距vspacevspace 6 6、圖像相對于文字基準(zhǔn)線的對齊方式圖像相對于文字基準(zhǔn)線的對齊方式alignalign 7 7、圖像的提示文字圖像的提示文字altalt 設(shè)置圖像屬性設(shè)置圖像屬性圖片顯示大小圖片顯示大小我們可以指定一幅圖片在瀏覽器窗口里的顯示大小。我們

4、可以指定一幅圖片在瀏覽器窗口里的顯示大小。定義圖片的顯示大小的方法是：定義圖片的顯示大小的方法是：width指定圖片的寬度，指定圖片的寬度，height指定高度。它們的指定高度。它們的屬性值可以是像素，也可以是屬性值可以是像素，也可以是%。6.2.html、6.3.html設(shè)置圖像屬性設(shè)置圖像屬性圖片的邊框圖片的邊框我們可以為一幅圖片加一個邊框以突出顯示：我們可以為一幅圖片加一個邊框以突出顯示： nborder的屬性值為像素?cái)?shù)的屬性值為像素?cái)?shù)6.4.html設(shè)置圖像屬性設(shè)置圖像屬性圖片的間距圖片的間距6.5.html、6.6.html圖片在顯示時，與左右的文本之間可以有一定的間距語法語法 語法

5、解釋語法解釋Hspace(horizontal)定義水平間距； Vspace(vertical)定義垂直間距。單位都是像素?cái)?shù).設(shè)置圖像屬性設(shè)置圖像屬性圖片的對齊方式圖片的對齊方式6.7.html圖片可以相對于頁面或單元格有一個對齊方式。 定義水平對齊方式的方法是：定義水平對齊方式的方法是： 定義圖片的垂直對齊方式：定義圖片的垂直對齊方式：設(shè)置圖像屬性設(shè)置圖像屬性圖片的對齊方式圖片的對齊方式上面介紹了最常用的圖片對齊方式，下面再介紹一下其他的對齊方式。上面介紹了最常用的圖片對齊方式，下面再介紹一下其他的對齊方式。align取值取值 表示的含義表示的含義texttop 把圖像的頂部和同行中最高的文

6、本的頂部對齊把圖像的頂部和同行中最高的文本的頂部對齊 absmiddle 把圖像的中部和同行中最大項(xiàng)的中部對齊把圖像的中部和同行中最大項(xiàng)的中部對齊 baseline 把圖像的底部和文本的基線對齊把圖像的底部和文本的基線對齊 absbottom 把圖像的底部和同行中的最低項(xiàng)對齊把圖像的底部和同行中的最低項(xiàng)對齊 設(shè)置圖像屬性設(shè)置圖像屬性圖片的提示文字圖片的提示文字 提示文字有兩個作用。當(dāng)瀏覽該網(wǎng)頁時，如果圖像下載完成，鼠標(biāo)放提示文字有兩個作用。當(dāng)瀏覽該網(wǎng)頁時，如果圖像下載完成，鼠標(biāo)放在該圖像上，鼠標(biāo)旁邊會出現(xiàn)提示文字。也就是說，當(dāng)鼠標(biāo)指向圖像在該圖像上，鼠標(biāo)旁邊會出現(xiàn)提示文字。也就是說，當(dāng)鼠標(biāo)指向

7、圖像上方的時候，稍等片刻，可以出現(xiàn)圖像的提示性文字，這用于說明或上方的時候，稍等片刻，可以出現(xiàn)圖像的提示性文字，這用于說明或者描述圖像。第二個作用是，如果圖像沒有被下載，在圖像的位置上者描述圖像。第二個作用是，如果圖像沒有被下載，在圖像的位置上就會顯示提示文字。就會顯示提示文字。 語法語法 語法解釋語法解釋在該語法中，提示文字的內(nèi)容可以是中文，也可以是英文。在該語法中，提示文字的內(nèi)容可以是中文，也可以是英文。6.8.html圖像的超鏈接圖像的超鏈接對于給整個一幅圖像文件設(shè)置超鏈接來說，實(shí)現(xiàn)的方法比較簡單，其實(shí)現(xiàn)對于給整個一幅圖像文件設(shè)置超鏈接來說，實(shí)現(xiàn)的方法比較簡單，其實(shí)現(xiàn)的方法與文本鏈接類似

8、。的方法與文本鏈接類似。語法語法 語法解釋語法解釋在該語法中，在該語法中，href參數(shù)用來設(shè)置圖像的鏈接地址，而在圖像屬性中可以參數(shù)用來設(shè)置圖像的鏈接地址，而在圖像屬性中可以添加圖像的其他參數(shù)，如添加圖像的其他參數(shù)，如height、border、hspace等等 6.9.html圖像的超鏈接圖像的超鏈接圖像的超鏈接圖像的超鏈接6.10.html 創(chuàng)建表格創(chuàng)建表格本講大綱：1 1、表格的基本構(gòu)成表格的基本構(gòu)成tabletable、tr tr、tdtd 支持網(wǎng)站：2 2、設(shè)置表格的標(biāo)題設(shè)置表格的標(biāo)題captioncaption 3 3、表格的表頭表格的表頭thth 表格的創(chuàng)建表格的創(chuàng)建一月一月二月

9、二月三月三月120010001500表頭（用表頭（用來表示，來表示，表頭是特殊的單元格，表頭是特殊的單元格，其中的文字加進(jìn)去之后其中的文字加進(jìn)去之后默認(rèn)是居中并且加粗）默認(rèn)是居中并且加粗）表格（用表格（用來表示，表格來表示，表格可以有背景顏色、背景圖片）可以有背景顏色、背景圖片）每一行可以用每一行可以用來表示，單元格放在來表示，單元格放在行中，每行可以有很行中，每行可以有很多的單元格多的單元格。單元格（用單元格（用來表示，來表示，每個單元格可以每個單元格可以有背景顏色和背有背景顏色和背景圖片）景圖片）表格的標(biāo)記表格的標(biāo)記 元素：定義一個表格。每一個表格只元素：定義一個表格。每一個表格只有一對有

10、一對和和，一張頁面中可，一張頁面中可以有多個表格。以有多個表格。元素：定義表格的行，一個表格可以有多元素：定義表格的行，一個表格可以有多行，所以行，所以對于一個表格來說不是唯一的。對于一個表格來說不是唯一的。元素：定義表格的一個單元格。每行可以元素：定義表格的一個單元格。每行可以有不同數(shù)量的單元格，在有不同數(shù)量的單元格，在和和之間之間是單元格的具體內(nèi)容。是單元格的具體內(nèi)容。需要注意的是：上述的需要注意的是：上述的三個元素必須、而且只三個元素必須、而且只能夠配對使用能夠配對使用。缺少任何一個元素，都無法定。缺少任何一個元素，都無法定義出一個表格。義出一個表格。表格的基本結(jié)構(gòu)表格的基本結(jié)構(gòu)單元格內(nèi)

11、的文字單元格內(nèi)的文字.單元格內(nèi)的文字單元格內(nèi)的文字.設(shè)置表格的標(biāo)題設(shè)置表格的標(biāo)題caption 表格中除了表格中除了和和可用來設(shè)置表格的單元格外，還可以通過可用來設(shè)置表格的單元格外，還可以通過caption來設(shè)置特殊的一種單元格來設(shè)置特殊的一種單元格標(biāo)題單元格。表格的標(biāo)題一般位標(biāo)題單元格。表格的標(biāo)題一般位于整個表格的第一行，為表格標(biāo)識一個標(biāo)題行，如同在表格上方加一個于整個表格的第一行，為表格標(biāo)識一個標(biāo)題行，如同在表格上方加一個沒有邊框的行，通常用來存放表格標(biāo)題。沒有邊框的行，通常用來存放表格標(biāo)題。 語法語法 表格的標(biāo)題表格的標(biāo)題設(shè)置表格的標(biāo)題設(shè)置表格的標(biāo)題caption實(shí)例實(shí)例 下面下面插插入

12、了一入了一個個表格表格 添加表格的添加表格的實(shí)實(shí)例例 這這是表格中的第一是表格中的第一個單個單元格元格第一行中的第二第一行中的第二個單個單元格元格 這這是表格的第二行是表格的第二行第二行中的第二第二行中的第二個單個單元格元格 設(shè)置表格的表頭設(shè)置表格的表頭th實(shí)例演示實(shí)例演示 設(shè)置表格的基本屬性設(shè)置表格的基本屬性width屬性：指定表格或某一個表格單元格的寬度。單位可以是%或者像素。height屬性：指定表格或某一個表格單元格的高度。單位可以是%或者像素。align屬性：指定表格或某一個單元格里的內(nèi)容（文本、圖片等）的對齊方式。 align參數(shù)可以取值為left（左對齊）、center（居中）或

13、者right（右對齊）。 設(shè)置表格的邊框設(shè)置表格的邊框border屬性：表格邊線粗細(xì)。bordercolor屬性：指定邊框的顏色，設(shè)置邊框顏色的前提是邊框的寬度不能為0。Cellspacing屬性：指定表格內(nèi)部各個單元格之間的寬度。 Cellpadding屬性：指定表格內(nèi)文字與邊框間距。7.1.html、7.2.html、7.3.html設(shè)置表格背景設(shè)置表格背景bgcolor屬性：指定表格或某一個單元格的背景顏色。background屬性：指定表格或某一個單元格的背景圖片。其屬性值為一個URL地址。7.4.html、7.5.html設(shè)置表格的行屬性設(shè)置表格的行屬性height屬性：指定行的高度

14、。bordercolor屬性：為單獨(dú)的行設(shè)置其外框顏色。bgcolor、background屬性：為行設(shè)置單獨(dú)的背景顏色和背景圖片align屬性：行文字的水平對齊方式，包括3種：left、center和right valign 屬性：行文字的垂直對齊方式。align屬性：設(shè)置表格標(biāo)題的對齊方式由于表格標(biāo)題也是行的一種，其水平對齊方式的設(shè)置與其他行相同，通過align參數(shù)來設(shè)置，這里不再重復(fù)說明。此處講解一下標(biāo)題的垂直對齊方式，雖然同樣適用align參數(shù)來設(shè)置，但與其他行不同的是，標(biāo)題的垂直對齊方式是指標(biāo)題位于表格的上方或下方。7.6.html7.11.html調(diào)整單元格屬性調(diào)整單元格屬性 本講

15、大綱：1 1、單元格大小單元格大小widthwidth、heightheight 支持網(wǎng)站：2 2、水平跨度水平跨度colspancolspan 3 3、垂直跨度垂直跨度rowspanrowspan 4 4、對齊方式對齊方式alignalign、valignvalign 5 5、設(shè)置單元格的背景色設(shè)置單元格的背景色 6 6、設(shè)置單元格的邊框顏色設(shè)置單元格的邊框顏色bordercolorbordercolor 7 7、設(shè)置單元格的亮邊框設(shè)置單元格的亮邊框bordercolorlightbordercolorlight 8 8、設(shè)置單元格的暗邊框設(shè)置單元格的暗邊框bordercolordarkbo

16、rdercolordark 9 9、設(shè)置單元格的背景圖像設(shè)置單元格的背景圖像backgroundbackground 調(diào)整單元格的屬性調(diào)整單元格的屬性width、height屬性：指定單元格的高度和寬度，單元格高度和寬度的單位是像素 。colspan屬性：指定單元格水平跨度 ，單元格跨越幾列。rowspan屬性：指定單元格垂直方向上跨行 valign屬性：指定某一個單元格里的內(nèi)容（文本、圖片等）的垂直對齊方式。垂直對齊方式的屬性值包ntop：頂端對齊；nmiddle：居中對齊；nbottom：底端對齊；nBaseline：相對于基線對齊；調(diào)整單元格的屬性調(diào)整單元格的屬性align屬性：指定某一

17、個單元格里的內(nèi)容（文本、圖片等）水平對齊方式的取值可以是left、center或right 。bgcolor屬性：指定單元格背景顏色。bordercolorlight屬性：指定單元格的亮邊框。 bordercolordark屬性：指定單元格的暗邊框。background屬性：指定單元格的背景圖像7.12.html7.19.html層的概述層的概述 層屬于網(wǎng)頁中的塊級元素，層元素中可以包含層屬于網(wǎng)頁中的塊級元素，層元素中可以包含所有其他的所有其他的HTML代碼。層提供了一種分塊控制代碼。層提供了一種分塊控制網(wǎng)頁內(nèi)容的方法。可以通過改變層的位置來改變網(wǎng)頁內(nèi)容的方法。可以通過改變層的位置來改變層中內(nèi)

18、容在網(wǎng)頁中的相對位置。層中的內(nèi)容與網(wǎng)層中內(nèi)容在網(wǎng)頁中的相對位置。層中的內(nèi)容與網(wǎng)頁中其他元素內(nèi)容不同之處是，各層之間可以彼頁中其他元素內(nèi)容不同之處是，各層之間可以彼此疊加，各層在此疊加，各層在Z坐標(biāo)（垂直于頁面的方向上）的坐標(biāo)（垂直于頁面的方向上）的次序可以改變。次序可以改變。層的分類層的分類 在Dreamweaver中，層有兩類，即CSS層與Netscape層。CSS層：使用div與span標(biāo)簽定位頁面內(nèi)容。Netscape層：使用layer與ilayer標(biāo)簽定位頁面內(nèi)容。 在Web頁面中插入層時，Dreamweaver將這些層的HTML標(biāo)簽插入到代碼中，可以為層設(shè)置四種不同的標(biāo)簽：div、s

19、pan、layer和ilayer。其中div和span是最常見的標(biāo)簽， Internet Explorer 4.0和Netscape Navigator 4.0都支持使用div和span標(biāo)簽創(chuàng)建的層。只有Navigator 4.0版本支持使用layer和ilayer創(chuàng)建的層（Netscape在其后續(xù)版本瀏覽器中停止了對這兩種標(biāo)簽的支持）。這些瀏覽器的早期版本都可以顯示層的內(nèi)容，但不能顯示其位置。 定義數(shù)據(jù)塊定義數(shù)據(jù)塊 創(chuàng)建層的首先的步驟之一是定義認(rèn)為是一層的數(shù)據(jù)的塊。如果考慮一個普通的應(yīng)用程序，如果一個瀏覽器，窗口可能被認(rèn)為是第一層。當(dāng)在一個菜單上單擊鏈接時，菜單本身被顯示在窗口之上這樣是在第

20、一層之上的第二層。如果在一個級聯(lián)處的子菜單上單擊鏈接，這是另一個層（它可能或可能不是與第一個層同級）。 當(dāng)前定義這些數(shù)據(jù)塊的方法是通過標(biāo)簽的使用。這些標(biāo)簽在一個文檔中創(chuàng)建一個確定的塊級結(jié)構(gòu)。在表示方面，它與標(biāo)簽類似，除了被假設(shè)不僅示意一個新段的開始而且將它里面的數(shù)據(jù)定義為一個段落的一部分。另一方面，標(biāo)簽定義數(shù)據(jù)不只是它告訴瀏覽器怎樣轉(zhuǎn)換它。 使用標(biāo)簽很簡單。必須做的所有的事情就是將它放在想定為一個數(shù)據(jù)塊的元素的周圍標(biāo)簽相關(guān)知識標(biāo)簽相關(guān)知識概念概念div全稱全稱division，意為，意為“區(qū)分區(qū)分”。標(biāo)簽被稱為區(qū)標(biāo)簽被稱為區(qū)隔標(biāo)簽，表示一塊可顯示隔標(biāo)簽，表示一塊可顯示 HTML 的區(qū)域。主要作

21、用是設(shè)的區(qū)域。主要作用是設(shè)定字、畫、表格等的擺放位置。定字、畫、表格等的擺放位置。標(biāo)簽是塊元素，標(biāo)簽是塊元素，需要關(guān)閉標(biāo)簽。需要關(guān)閉標(biāo)簽。語法語法.屬性屬性由于由于標(biāo)簽的屬性很多，這里主要對其常用屬性標(biāo)簽的屬性很多，這里主要對其常用屬性進(jìn)進(jìn)行介紹。行介紹。的常用屬性的常用屬性align1.Align屬性 通過設(shè)置屬性ALIGN，可以改變標(biāo)簽的水平對齊方式。語法left：居左對齊。center：居中對齊。right：居右對齊。例如，使用align屬性設(shè)置文字居中對齊，代碼如下：此文本代表另外一段，其中文本居中顯示。的常用屬性的常用屬性id屬性屬性2. ID屬性 id屬性用于定義一個元素的獨(dú)特的樣

22、式，即設(shè)置標(biāo)簽的標(biāo)識。語法id=str例如，一個CSS規(guī)則：#font1 font-size: larger使用方法id=font1id是一個標(biāo)簽，用于區(qū)分不同的結(jié)構(gòu)和內(nèi)容，就像人的名字，如果一個屋子有2個人同名，就會出現(xiàn)混淆。的常用屬性的常用屬性class屬性屬性3. Class屬性 class屬性用于指定元素屬于何種樣式的類，即設(shè)置標(biāo)簽的類。語法classname color classname：Class屬性的名稱。例如，樣式表可以加入：color1 color: lime; background: #ff80c0 使用方法class=color1說明說明：class是一個樣式，可以套在

23、任何結(jié)構(gòu)和內(nèi)容上。ID屬性和屬性和Class屬性的區(qū)別屬性的區(qū)別 Id屬性是先找到結(jié)構(gòu)屬性是先找到結(jié)構(gòu)/內(nèi)容，再給它定義樣式內(nèi)容，再給它定義樣式 ID屬性通常用于定義頁面上一個僅出現(xiàn)一次的標(biāo)簽。在對頁面排版進(jìn)行結(jié)構(gòu)化布局時（比如說通常一個頁面都是由一個頁眉，一個報(bào)頭，一個內(nèi)容區(qū)域和一個頁腳等組成），一般使用ID比較理想，因?yàn)橐粋€ID在一個文檔中只能被使用一次。而這些元素在同一頁面中很少會出現(xiàn)大于一次的情況。class屬性是先定義好一種樣式，再套給多個結(jié)構(gòu)屬性是先定義好一種樣式，再套給多個結(jié)構(gòu)/內(nèi)容內(nèi)容 Class屬性是用來根據(jù)用戶定義的標(biāo)準(zhǔn)對一個或多個元素進(jìn)行定義的。打個比較恰當(dāng)?shù)谋确骄褪莿”?/p>

24、：一個Class可以定義劇本中每個人物的故事線，可以通過CSS，JavaScript等來使用這個類。因此可以在一個頁面上使用class=“Frodo” ，class= “Gandalf”， class=“Aragorn”來區(qū)分不同的故事線。還有一點(diǎn)非常重要的是可以在一個文檔中使用任意次數(shù)的Class。 總而言之，Class屬性可以反復(fù)使用而ID屬性在一個頁面中僅能被使用一次。有可能在很大部分瀏覽器中反復(fù)使用同一個ID不會出現(xiàn)問題，但在標(biāo)準(zhǔn)上這絕對是錯誤的使用，而且很可能導(dǎo)致某些瀏覽器的現(xiàn)實(shí)問題。ID屬性和屬性和Class屬性的區(qū)別屬性的區(qū)別還有一個區(qū)別，在一個結(jié)構(gòu)文檔中，可以多處使用同一個還有

25、一個區(qū)別，在一個結(jié)構(gòu)文檔中，可以多處使用同一個class名，名，而而id名必須是唯一的。名必須是唯一的。例如，定義一個描述字體的例如，定義一個描述字體的CSS。代碼如下：。代碼如下：.font color:#009900; 下面的文檔中將多次使用到同一個樣式表下面的文檔中將多次使用到同一個樣式表“.font”，代碼如下：，代碼如下： JavaScript技術(shù)大全技術(shù)大全網(wǎng)址：網(wǎng)址：http:/而而id名在同一個文檔中是需要唯一的，名稱不可以重復(fù)。名在同一個文檔中是需要唯一的，名稱不可以重復(fù)。說明：說明：在實(shí)際應(yīng)用中，在實(shí)際應(yīng)用中，Class可能對文字的排版等比較有用，而可能對文字的排版等比較有

26、用，而ID則對宏觀則對宏觀布局和設(shè)計(jì)放置各種元素較有用。布局和設(shè)計(jì)放置各種元素較有用。的常用屬性的常用屬性Style屬性屬性 4. Style屬性 Style屬性用于設(shè)置對象的內(nèi)嵌樣式。語法例如：使用Style屬性定義標(biāo)簽樣式，代碼如下：日志內(nèi)容。標(biāo)簽與標(biāo)簽與標(biāo)簽的對比標(biāo)簽的對比p2標(biāo)簽與標(biāo)簽與標(biāo)簽的對比標(biāo)簽的對比標(biāo)簽與標(biāo)簽與標(biāo)簽的對比標(biāo)簽的對比 HTML只是賦予內(nèi)容的手段，大部分只是賦予內(nèi)容的手段，大部分HTML標(biāo)簽都有其意義（標(biāo)簽標(biāo)簽都有其意義（標(biāo)簽p創(chuàng)建段落創(chuàng)建段落，h1標(biāo)簽創(chuàng)建標(biāo)題等等）的，然而標(biāo)簽創(chuàng)建標(biāo)題等等）的，然而和和標(biāo)簽似乎沒有任何內(nèi)容上標(biāo)簽似乎沒有任何內(nèi)容上的意義，聽起來就像

27、一個泡沫做成的錘子一樣無用。但實(shí)際上，與的意義，聽起來就像一個泡沫做成的錘子一樣無用。但實(shí)際上，與CSS結(jié)合起來結(jié)合起來后，它們被用得十分廣泛。它們被用來組合一大塊的后，它們被用得十分廣泛。它們被用來組合一大塊的HTML代碼并賦予一定的信代碼并賦予一定的信息，大部分用類屬性息，大部分用類屬性class和標(biāo)識屬性和標(biāo)識屬性id與元素聯(lián)系起來。與元素聯(lián)系起來。例如，要強(qiáng)調(diào)單詞例如，要強(qiáng)調(diào)單詞“crazy”和加粗類和加粗類“paper”，代碼如下：，代碼如下：This is crazy說明：說明：這個做法比再加一個這個做法比再加一個標(biāo)簽還要好。需要記住的是，標(biāo)簽還要好。需要記住的是，標(biāo)簽和標(biāo)簽和標(biāo)簽

28、是標(biāo)簽是“無意義無意義”的標(biāo)簽。的標(biāo)簽。標(biāo)簽與標(biāo)簽與標(biāo)簽的對比標(biāo)簽的對比標(biāo)簽和標(biāo)簽和標(biāo)簽的區(qū)別標(biāo)簽的區(qū)別 DIV（division）是一個塊級元素，可以包含段落、標(biāo)題、表格，乃至諸如章節(jié)、摘要和備注等。而SPAN是行內(nèi)元素，SPAN的前后是不會換行的，它沒有結(jié)構(gòu)的意義，純粹是應(yīng)用樣式，當(dāng)其他行內(nèi)元素都不合適時，可以使用SPAN。 從功能角度來說，標(biāo)簽一般用來做布局，而標(biāo)簽用來做文字的效果，尤其是標(biāo)題和鏈接的效果，所以會經(jīng)?？匆娭T如 .之類的代碼。不過，塊元素和行內(nèi)元素也不是一成不變的，只要給塊元素定義display:inline，塊元素便成為嵌元素；同樣，給內(nèi)嵌元素定義display:bloc

29、k后，內(nèi)嵌元素便成為塊元素。block和inline的區(qū)別主要有內(nèi)容模型（Content model）、格式（formatting）和Directionality（如何處理兩種語言混合在一起的unicode碼）。標(biāo)簽與標(biāo)簽與標(biāo)簽的對比標(biāo)簽的對比例如： .是塊，是行，塊里可以行。也就是DIV塊里可以有SPAN行。 顯示時（分塊結(jié)束處），系統(tǒng)自動換行，而不換行。例如，當(dāng)使用標(biāo)簽時，代碼如下：aaaaaaaaabbbbbbbbbcccccccccc 運(yùn)行結(jié)果：aaaaaaaaa bbbbbbbbb ccccc ccccc 當(dāng)使用標(biāo)簽時，代碼如下：aaaaaaaaabbbbbbbbbccccccccc

30、c 運(yùn)行結(jié)果：aaaaaaaaabbbbbbbbbccccc ccccc 標(biāo)簽標(biāo)簽 概念概念 標(biāo)簽，又叫浮動幀標(biāo)簽，可以利用簽將一個HTML文檔嵌入在一個HTML中顯示。使用標(biāo)簽，能夠拖入外部文件。這樣可以更好地管理內(nèi)容，并且提供了一種在不同位置包含內(nèi)容的機(jī)制。語法語法標(biāo)簽屬性標(biāo)簽屬性標(biāo)簽屬性標(biāo)簽屬性浮動框架的文件路徑屬性SRC語法語法file_name：指明浮動框架文件的文件名或者其他超鏈接的網(wǎng)址。浮動框架的名稱屬性NAME語法語法frame_name：定義的浮動框架名稱。浮動框架的對齊屬性ALIGN語法語法left：居左對齊。center：居中對齊。right：居右對齊。浮動框架的寬度和高

31、度屬性WIDTH、HEIGHT語法語法WIDTH：浮動框架的寬度。HEIGHT：浮動框架的高度。標(biāo)簽屬性標(biāo)簽屬性浮動框架滾動條顯示屬性SCROLLING語法語法value有3個取值。YES：顯示滾動條。NO：不顯示滾動條。AUTO：根據(jù)窗口內(nèi)容決定是否有滾動條。浮動框架邊框?qū)傩訤RAMEBORDER語法語法value：值為yes代表顯示框架邊框，值為no代表隱藏框架邊框。浮動框架邊緣的寬度和高度屬性MARGINWIDTH、MARGINHEIGHT語法語法MARGINWIDTH：設(shè)定浮動框架左右邊緣與邊框的寬度。MARGINHEIGHT：設(shè)定浮動框架上下邊緣與邊框的高度。標(biāo)簽只適用于標(biāo)簽只適用于

32、IE瀏覽器。它的作用是在網(wǎng)頁中插入一個框?yàn)g覽器。它的作用是在網(wǎng)頁中插入一個框架窗口以顯示另一個文件。通常，浮動框架配合一個能夠辨認(rèn)瀏覽器的架窗口以顯示另一個文件。通常，浮動框架配合一個能夠辨認(rèn)瀏覽器的JavaScript代碼會有比較好的效果。代碼會有比較好的效果。標(biāo)簽和標(biāo)簽和標(biāo)簽標(biāo)簽 概述概述 層可以被用層可以被用標(biāo)簽和標(biāo)簽和標(biāo)簽在標(biāo)簽在Navigator中中定義。定義。標(biāo)簽和標(biāo)簽和標(biāo)簽允許在一個頁面上精確標(biāo)簽允許在一個頁面上精確地定位一個層，地定位一個層，標(biāo)簽和標(biāo)簽和標(biāo)簽出現(xiàn)在文檔的標(biāo)簽出現(xiàn)在文檔的流程放置他們的任何地方。流程放置他們的任何地方。語法語法語法語法標(biāo)簽和標(biāo)簽和標(biāo)簽屬性標(biāo)簽屬性

33、屬性屬性 說明說明 above 在文檔中的所有層的在文檔中的所有層的z-order中較高的中較高的Layer對象（如果層是最頂?shù)?，為對象（如果層是最頂?shù)?，為null） background 用作層的背景的一個圖你的用作層的背景的一個圖你的URL below 在文檔中的所有層的在文檔中的所有層的z-order中較低的中較低的Layer對象（如果層是最低的，為對象（如果層是最低的，為null） bgcolor 層的背景色層的背景色 clip 定義剪切長方形。這個長方形是層的可見區(qū)域。這個長方形之外的任何東西都被人定義剪切長方形。這個長方形是層的可見區(qū)域。這個長方形之外的任何東西都被人從視野中剪掉從

34、視野中剪掉 height 以像素單位的層的高度以像素單位的層的高度 left 以像素為單位的層的相對于它的父層的區(qū)域的以像素為單位的層的相對于它的父層的區(qū)域的x軸的位置軸的位置 name 層的名字層的名字 src 層的內(nèi)容來源的層的內(nèi)容來源的URL top 以像素為單位的層的相對于它的父層的區(qū)域的以像素為單位的層的相對于它的父層的區(qū)域的y軸的位置軸的位置 標(biāo)簽和標(biāo)簽和標(biāo)簽屬性標(biāo)簽屬性屬性屬性 說明說明 visibility 定義層的可見性屬性。定義層的可見性屬性。Show顯示層，顯示層，hide隱藏層，隱藏層，Inherit導(dǎo)致繼承它的父層的導(dǎo)致繼承它的父層的可見性可見性 width 以像素為

35、單位的層的寬度以像素為單位的層的寬度 z-index 層相對于它的兄弟元素和父元素的相對層相對于它的兄弟元素和父元素的相對z-order 標(biāo)簽和標(biāo)簽和標(biāo)簽的區(qū)別標(biāo)簽的區(qū)別標(biāo)簽與標(biāo)簽與標(biāo)簽的屬性是完全一致的，唯一的區(qū)別在于標(biāo)簽的屬性是完全一致的，唯一的區(qū)別在于標(biāo)簽包含有流動性的標(biāo)簽包含有流動性的坐標(biāo)。例如：坐標(biāo)。例如：第一行第一行第二行第二行第三行第三行這樣一來，這樣一來，3條記錄會重疊在一起。條記錄會重疊在一起。若改用若改用，例如：，例如：第一行第一行第二行第二行第三行第三行這樣一來，這這樣一來，這3條記錄就是自動分行顯示。條記錄就是自動分行顯示。應(yīng)用應(yīng)用DIV制作下拉菜單導(dǎo)航條制作下拉菜單導(dǎo)

36、航條 本實(shí)例通過層制作了一個下拉菜單，當(dāng)用鼠標(biāo)指向下拉菜單時，會根據(jù)指定本實(shí)例通過層制作了一個下拉菜單，當(dāng)用鼠標(biāo)指向下拉菜單時，會根據(jù)指定的菜單在下面以下拉的方式顯示下拉列表，并可以通過單擊下拉列表中的選項(xiàng)進(jìn)的菜單在下面以下拉的方式顯示下拉列表，并可以通過單擊下拉列表中的選項(xiàng)進(jìn)入指定的網(wǎng)頁。運(yùn)行結(jié)果如下圖入指定的網(wǎng)頁。運(yùn)行結(jié)果如下圖1、圖、圖2、圖、圖3所示。所示。使用表單標(biāo)記使用表單標(biāo)記form 概述概述 在在HTML中，中，標(biāo)記對用來標(biāo)記對用來創(chuàng)建一個表單，即定義表單的開始和結(jié)束位置，在標(biāo)創(chuàng)建一個表單，即定義表單的開始和結(jié)束位置，在標(biāo)記對之間的一切都屬于表單的內(nèi)容。每個表單元素開記對之間的

37、一切都屬于表單的內(nèi)容。每個表單元素開始于始于form元素，可以包含所有的表單控件，還有任元素，可以包含所有的表單控件，還有任何必需的伴隨數(shù)據(jù)，如控件的標(biāo)簽、處理數(shù)據(jù)的腳本何必需的伴隨數(shù)據(jù)，如控件的標(biāo)簽、處理數(shù)據(jù)的腳本或程序的位置等。在表單的或程序的位置等。在表單的標(biāo)記中，還可以標(biāo)記中，還可以設(shè)置表單的基本屬性，包含表單的名稱、處理程序、設(shè)置表單的基本屬性，包含表單的名稱、處理程序、傳送方法等。一般情況下，表單的處理程序傳送方法等。一般情況下，表單的處理程序action和和傳送方法傳送方法method是必不可少的參數(shù)。是必不可少的參數(shù)。元素的屬性元素的屬性action屬性：用來定義表單處理程序的

38、位置(相對地址或絕對地址)。Name屬性：用來給表單命名。Method屬性：定義表單結(jié)果從瀏覽器傳送到服務(wù)器的方法，一般有兩種方法：get、post。enctype 屬性：用于設(shè)置表單信息提交的編碼方式。 enctype屬性為表單定義了屬性為表單定義了MIME編碼方式，編碼編碼方式，編碼方式的取值如下表所示方式的取值如下表所示MIME編碼方式的取值enctype取值取值 取值的含義取值的含義 text/plain 以純文本的形式傳送以純文本的形式傳送 application/x-www-form-urlencoded 默認(rèn)的編碼形式默認(rèn)的編碼形式 multipart/form-data MIM

39、E編碼，上傳文件的表單必須選擇該項(xiàng)編碼，上傳文件的表單必須選擇該項(xiàng) 編碼方式的取值編碼方式的取值 元素的屬性元素的屬性target屬性：用來指定目標(biāo)窗口的打開方式。 目標(biāo)窗口的打開方式包含4個取值 _blank是指將返回的信息顯示在新打開的窗口中；是指將返回的信息顯示在新打開的窗口中；_parent是指將返回信息顯示在父級的瀏覽器窗口中；是指將返回信息顯示在父級的瀏覽器窗口中；_self則表示將返回信息顯示在當(dāng)前瀏覽器窗口；則表示將返回信息顯示在當(dāng)前瀏覽器窗口；_top表示將返回信息顯示在頂級瀏覽器窗口中。表示將返回信息顯示在頂級瀏覽器窗口中。Method屬性中屬性中g(shù)et方法與方法與post

40、方法的區(qū)別方法的區(qū)別控件的添加控件的添加輸入類的控件輸入類的控件 本講大綱：1 1、文字字段文字字段texttext 支持網(wǎng)站：2 2、密碼域密碼域passwordpassword 3 3、單選按鈕單選按鈕radioradio 4 4、復(fù)選框復(fù)選框checkboxcheckbox 5 5、普通按鈕普通按鈕buttonbutton 6 6、提交按鈕提交按鈕submitsubmit 7 7、重置按鈕重置按鈕resetreset 8 8、圖像域圖像域imageimage 9 9、隱藏域隱藏域hiddenhidden 1010、文件域文件域filefile 輸入類控件輸入類控件9.1.html、9.2

41、.html ? 文本框的名字文本框的名字* text,password* 默認(rèn)值默認(rèn)值* 長度長度? 最大輸入字符數(shù)最大輸入字符數(shù)單選按鈕單選按鈕單選框能夠進(jìn)行項(xiàng)目的單項(xiàng)選擇，以一個圓框表示。單選框能夠進(jìn)行項(xiàng)目的單項(xiàng)選擇，以一個圓框表示。語法語法語法解釋語法解釋 在該語法中，在該語法中，checked屬性表示這一單選按鈕默認(rèn)被選中，屬性表示這一單選按鈕默認(rèn)被選中，而在一個單選按鈕組中只能有一項(xiàng)單選按鈕控件設(shè)置為而在一個單選按鈕組中只能有一項(xiàng)單選按鈕控件設(shè)置為checked。Value則用來設(shè)置用戶選中該項(xiàng)目后，傳送到處理則用來設(shè)置用戶選中該項(xiàng)目后，傳送到處理程序中的值。程序中的值。9.3.ht

42、ml復(fù)選框復(fù)選框9.4.html復(fù)選框在頁面中以一個方框來表示。復(fù)選框在頁面中以一個方框來表示。語法語法語法解釋語法解釋 在該語法中，在該語法中， checked參數(shù)表示該選項(xiàng)在默認(rèn)情參數(shù)表示該選項(xiàng)在默認(rèn)情況下已經(jīng)被選中，一個選擇中可以有多個復(fù)選框被選中。況下已經(jīng)被選中，一個選擇中可以有多個復(fù)選框被選中。 按鈕按鈕包括普通按鈕、提交按鈕和重置按鈕包括普通按鈕、提交按鈕和重置按鈕語法語法input type=“name=“B1input type= name=“B2input type= name=“B39.5、9.6.html提交按鈕與重置按鈕提交按鈕與重置按鈕提交按鈕：提交按鈕： 重置按鈕：

43、重置按鈕：圖像域圖像域概述概述 圖像域是指可以用在提交按鈕位置上的圖片，這幅圖片具有按圖像域是指可以用在提交按鈕位置上的圖片，這幅圖片具有按鈕的功能。使用默認(rèn)的按鈕形式往往會讓人覺得單調(diào)。如果網(wǎng)頁鈕的功能。使用默認(rèn)的按鈕形式往往會讓人覺得單調(diào)。如果網(wǎng)頁使用了較為豐富的色彩，或稍微復(fù)雜的設(shè)計(jì)，再使用表單默認(rèn)的使用了較為豐富的色彩，或稍微復(fù)雜的設(shè)計(jì)，再使用表單默認(rèn)的按鈕形式甚至?xí)茐恼w的美感。這時，可以使用圖像域，創(chuàng)建按鈕形式甚至?xí)茐恼w的美感。這時，可以使用圖像域，創(chuàng)建和網(wǎng)頁整體效果相統(tǒng)一的圖像提交按鈕。和網(wǎng)頁整體效果相統(tǒng)一的圖像提交按鈕。語法語法語法解釋語法解釋在該語法中，圖像地址可以是絕

44、對地址或相對地址。在該語法中，圖像地址可以是絕對地址或相對地址。9.7.html隱藏域隱藏域表單中的隱藏域主要用來傳遞一些參數(shù)，而這些參數(shù)不需要在頁面中表單中的隱藏域主要用來傳遞一些參數(shù)，而這些參數(shù)不需要在頁面中顯示。當(dāng)瀏覽者提交表單時，隱藏域的內(nèi)容會一起提交給處理程序。顯示。當(dāng)瀏覽者提交表單時，隱藏域的內(nèi)容會一起提交給處理程序。語法語法9.8.html文件域文件域列表列表/菜單標(biāo)記菜單標(biāo)記 文本域標(biāo)記文本域標(biāo)記textarea 概述概述 除了以上講解的兩大類控件外，還有一種特殊定義的文本樣除了以上講解的兩大類控件外，還有一種特殊定義的文本樣式，稱為文字域或文本域。它與文字字段的區(qū)別在于可以添

45、加多式，稱為文字域或文本域。它與文字字段的區(qū)別在于可以添加多行文字，從而可以輸入更多的文本。這類控件在一些留言本中最行文字，從而可以輸入更多的文本。這類控件在一些留言本中最為常見。為常見。語法語法文本域標(biāo)記文本域標(biāo)記textarea語法解釋語法解釋語法中各屬性的含義如下表所示語法中各屬性的含義如下表所示文字域標(biāo)記屬性文字域標(biāo)記屬性 描述描述 Name 文字域的名稱文字域的名稱 Rows 文字域的行數(shù)文字域的行數(shù) Cols 文字域的列表文字域的列表 Value 文字域的默認(rèn)值文字域的默認(rèn)值 9.10.html設(shè)置滾動文字設(shè)置滾動文字 本講大綱：1 1、滾動文字標(biāo)記滾動文字標(biāo)記marqueemar

46、quee 支持網(wǎng)站：2 2、滾動方向?qū)傩詽L動方向?qū)傩詃irectiondirection 3 3、滾動方式屬性滾動方式屬性behaviorbehavior 4 4、滾動速度屬性滾動速度屬性scrollamountscrollamount 5 5、滾動延遲屬性滾動延遲屬性scrolldelayscrolldelay 6 6、滾動循環(huán)屬性滾動循環(huán)屬性looploop 7 7、滾動范圍屬性滾動范圍屬性widthwidth、heightheight 8 8、滾動背景顏色屬性滾動背景顏色屬性bgcolorbgcolor 9 9、滾動空間屬性滾動空間屬性hspacehspace、vspacevspace

47、滾動文字標(biāo)記滾動文字標(biāo)記marquee 概述概述 使用使用marquee標(biāo)記可以將文字設(shè)置為動態(tài)滾動的標(biāo)記可以將文字設(shè)置為動態(tài)滾動的效果效果?；菊Z法基本語法 滾動文字滾動文字語法解釋語法解釋 只要在標(biāo)記之間添加要進(jìn)行滾動的文字即可，而且只要在標(biāo)記之間添加要進(jìn)行滾動的文字即可，而且可以在標(biāo)記之間設(shè)置這些文字的字體、顏色等可以在標(biāo)記之間設(shè)置這些文字的字體、顏色等 文字移動屬性文字移動屬性(1)方向 ：direction=#=left, right,up,down(2)方式： behavior=# #=scroll(循環(huán)), slide(只走一次), alternate(來回走)(3)循環(huán): lo

48、op=# #=次數(shù)；若未指定則循環(huán)不止(infinite)(4)速度: scrollamount=#(5)延時: scrolldelay=#文字移動屬性文字移動屬性(1)底色: bgcolor=#l#=RRGGBB 16 進(jìn)制顏色代碼(2)面積: height=# width=#(3)空白:hspace=# vspace=# 添加背景音樂添加背景音樂概述概述 在網(wǎng)頁中，除了可以嵌入普通的聲音文件外，還可以為某個在網(wǎng)頁中，除了可以嵌入普通的聲音文件外，還可以為某個網(wǎng)頁設(shè)置背景音樂。作為背景音樂的可以是音樂文件，也可以是網(wǎng)頁設(shè)置背景音樂。作為背景音樂的可以是音樂文件，也可以是聲音文件，其中最常用的

49、是聲音文件，其中最常用的是midi文件。文件。語法語法語法解釋語法解釋作為背景音樂的文件還可以是作為背景音樂的文件還可以是avi文件、文件、MP3文件等音樂文件文件等音樂文件。10.1.html背景音樂的循環(huán)設(shè)置背景音樂的循環(huán)設(shè)置概述 通常情況下，背景音樂需要不斷地播放，但有時也需要指定播放的次數(shù)。這一功能實(shí)現(xiàn)起來并不難，只要設(shè)置相應(yīng)的loop參數(shù)即可。語法語法解釋 如果希望無限次循環(huán)播放背景音樂，可將循環(huán)次數(shù)設(shè)置為true。添加多媒體文件添加多媒體文件 本講大綱：1 1、添加多媒體文件標(biāo)記添加多媒體文件標(biāo)記embedembed 支持網(wǎng)站：2 2、設(shè)置自動運(yùn)行設(shè)置自動運(yùn)行autostartau

50、tostart 3 3、設(shè)置媒體文件的循環(huán)播放設(shè)置媒體文件的循環(huán)播放looploop 4 4、隱藏面板隱藏面板hiddenhidden 5 5、添加其他類型的媒體文件添加其他類型的媒體文件 多媒體文件的添加多媒體文件的添加播放多媒體文件界面的高、寬width、height注意：注意：width和和height一定要設(shè)置，單位是像素，否則無法一定要設(shè)置，單位是像素，否則無法正確顯示播放多媒體文件的軟件正確顯示播放多媒體文件的軟件 自動運(yùn)行autostart Autostart的取值有兩個：一個是true，表示自動播放；另一個是false，表示不自動播放。10.2.html10.3.html循環(huán)播

51、放loop loop的取值不是具體的數(shù)字，而是true或者false，如果取值為true，表示媒體文件將無限次地循環(huán)播放，如果取值false，則只播放一次。隱藏面板hidden hidden可以設(shè)置了兩個值：一個是true，表示隱藏面板；另一個false，表示顯示面板，這是添加媒體文件的默認(rèn)選項(xiàng)。如果要保留聲音，就要設(shè)置文件的自動播放。HTML5的新認(rèn)識的新認(rèn)識 概述概述 任何新鮮事物的出現(xiàn)，都會帶給人們驚喜，同時也會存任何新鮮事物的出現(xiàn)，都會帶給人們驚喜，同時也會存在很多爭議。雖然在很多爭議。雖然Web開發(fā)者普遍認(rèn)為有了開發(fā)者普遍認(rèn)為有了HTML5是比是比較好的，但是還是會很擔(dān)心的，例如：新

52、的較好的，但是還是會很擔(dān)心的，例如：新的HTML5在老的在老的瀏覽器上能否正常運(yùn)行，會不會產(chǎn)生錯誤等各種問題。瀏覽器上能否正常運(yùn)行，會不會產(chǎn)生錯誤等各種問題。HTML5是基于各種各樣的理念進(jìn)行設(shè)計(jì)的，這些設(shè)計(jì)理念是基于各種各樣的理念進(jìn)行設(shè)計(jì)的，這些設(shè)計(jì)理念體現(xiàn)了對可能行和可行性的新認(rèn)識。體現(xiàn)了對可能行和可行性的新認(rèn)識。HTML5的新認(rèn)識的新認(rèn)識兼容性兼容性l對HTML以前的版本開發(fā)的網(wǎng)站做了很好的兼容lHTML5的一個核心理念就是保持一切新特性平滑過渡實(shí)用性和用戶優(yōu)先實(shí)用性和用戶優(yōu)先lHTML5規(guī)范是基于用戶優(yōu)先準(zhǔn)則編寫的 lHTML5內(nèi)只封裝了切實(shí)有用的功能，不封裝復(fù)雜而沒有實(shí)際意義的功能化

53、繁為簡化繁為簡以瀏覽器原生能力替代復(fù)雜的JavaScript代碼。新的簡化的DOCTYPE新的簡化的字符集聲明簡單而強(qiáng)大的HTML5API。HTML5的新特性的新特性u 新特性應(yīng)該基于HTML、CSS、DOM和JavaScript。u 減少了對外部插件的需求（比如Flash）。u 更優(yōu)秀的錯誤處理。 u 更多取代腳本的標(biāo)記。u HTML5應(yīng)該獨(dú)立于設(shè)備。u 用于繪畫的canvas元素。u 用于媒介回放的video和audio元素。u 對本地離線存儲的更好的支持。u 新元素和表單控件。 而這些新特性，正在如今的瀏覽器最新版本中得到越來越普遍的實(shí)現(xiàn)，越來越多的開發(fā)者開始學(xué)習(xí)和使用這些新特性。HTM

54、L5中的標(biāo)記方法中的標(biāo)記方法 內(nèi)容類型（ContentType） HTML5文件的擴(kuò)展名和內(nèi)容類型（ContentType）沒有發(fā)生變化。即擴(kuò)展名還是“.html”或“.htm”，內(nèi)容類型（ContentType）還“.text/html”。 DOCTYPE聲明 要使用HTML5標(biāo)記，必須先進(jìn)行如下的DOCTYPE聲明。不區(qū)分大小寫。語法如下： 另外，當(dāng)使用工具時，也可以在DOCTYPE聲明方式中加入SYSTEM標(biāo)識。（不區(qū)分大小寫。此外還可將雙引號換為單引號來使用），聲明方法如下面的代碼：HTML5中的標(biāo)記方法中的標(biāo)記方法 字符編碼的設(shè)置 字符編碼的設(shè)置方法也有些新的變化。以前，設(shè)置HTML

55、文件的字符編碼時，要用到如下元素，如下所示： 在HTML5中，可以使用元素的新屬性charset來設(shè)置字符編碼。 以上兩種方法都有效。因此也可以繼續(xù)使用前者的方法（通過content元素的屬性來設(shè)置）。但要注意不能同時使用。如下所示： 注意：注意：從HTML5開始，文件的字符編碼推薦使用UTF-8。HTML5語法中需要掌握的3個要點(diǎn) HTML5中規(guī)定的語法，在設(shè)計(jì)上兼顧了與現(xiàn)有HTML之間最大程度的兼容性。例如，在Web上充斥著“沒有結(jié)束標(biāo)簽”等HTML現(xiàn)象。HTML5不將這些視為錯誤，反而采取了“允許這些現(xiàn)象存在，并明確記錄在規(guī)范中”的方法。因此，盡管與XHTML相比標(biāo)記比較簡潔， 而在遵循

56、HTML5的Web瀏覽器中也能保證生成相同的DOM。 那么下面就來看看具體的HTML5語法?？梢允÷詷?biāo)簽的元素可以省略標(biāo)簽的元素 在HTML5中，有些元素可以省略標(biāo)簽。具體來講有3種情況，不允許寫結(jié)束標(biāo)記的元素有area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr 不允許寫結(jié)束標(biāo)記的元素是指，不允許使用開始標(biāo)記與結(jié)束標(biāo)記將元素括起來的的形式，只允許使用“”的形式進(jìn)行書寫。例如： “”的寫法是錯誤的。應(yīng)該寫成“”。當(dāng)然，沿襲下來的“”這種寫法也是允許的?？梢允÷詷?biāo)簽的元素可以省略標(biāo)簽

57、的元素可以省略結(jié)束標(biāo)簽 li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th可以省略整個標(biāo)簽（即連開始標(biāo)簽都不用寫明） html、head、body、colgroup、tbody需要注意的是，雖然這些元素可以省略，但實(shí)際上卻是隱式存在的。例如“”標(biāo)簽可以省略，但在DOM樹上它是存在的，可以永恒訪問“document.body”。上述元素中也包括了HTML5的新元素。有關(guān)這些新元素的用法，將在后面的章節(jié)中詳細(xì)講解。取得取得boolean值的屬性值的屬性省略屬性的引用符省略屬性的引用符 設(shè)置屬性值時，可以使用雙引號

58、或單引號來引用。HTML5語法則更進(jìn)一步，只要屬性值不包含空格、“”、“”、“”、“”、“=”等字符，都可以省略屬性的引用符。如下例所示。 新增的結(jié)構(gòu)元素新增的結(jié)構(gòu)元素 lsection元素 section元素定義文檔或應(yīng)用程序中的一個區(qū)段,比如章節(jié)、頁眉、頁腳或文檔中的其他部分。它可以與h1,h2,h3,h4,h5,h6元素結(jié)合起來使用，標(biāo)示文檔結(jié)構(gòu)。HTML5中代碼示例：HTML4中代碼示例：larticle元素 article元素表示文檔中的一塊獨(dú)立的內(nèi)容，譬如博客中的一篇文章或報(bào)紙中的一篇文章。HTML5中代碼示例：HTML4中代碼示例：新增的結(jié)構(gòu)元素新增的結(jié)構(gòu)元素lheader元素

59、header元素表示頁面中一個內(nèi)容區(qū)塊或整個頁面的標(biāo)題。HTML5中代碼示例：HTML4中代碼示例：lnav元素 nav元素表示導(dǎo)航鏈接的部分。HTML5中代碼示例： HTML4中代碼示例：新增的結(jié)構(gòu)元素新增的結(jié)構(gòu)元素lfooter元素 footer元素表示整個頁面或頁面中一個內(nèi)容區(qū)塊的腳注。一般來說，它會包含創(chuàng)作者的姓名、文檔的創(chuàng)作日期以及創(chuàng)建者聯(lián)系信息。HTML5中代碼示例：HTML4中代碼示例：新增的塊級（新增的塊級（block）的語義元素）的語義元素 aside元素 aside元素表示article元素的內(nèi)容之外的與article元素的內(nèi)容相關(guān)的有關(guān)內(nèi)容。 HTML5中代碼示例：HTM

60、L4中代碼示例：新增的塊級（新增的塊級（block）的語義元素）的語義元素figure元素 figure元素表示一段獨(dú)立的流內(nèi)容，一般表示文檔主體流內(nèi)容中的一個獨(dú)立單元。使用 元素為figure元素組添加標(biāo)題。HTML5中代碼示例：PRCThe Peoples Republic of China was born in 1949.HTML4中代碼示例：PRCThe Peoples Republic of China was born in 1949.新增的塊級（新增的塊級（block）的語義元素）的語義元素dialog元素 dialog標(biāo)簽定義對話，比如交談。注意：對話中的每個句子都必須屬于