《HTML及基本結(jié)構(gòu)》word版_第1頁
《HTML及基本結(jié)構(gòu)》word版_第2頁
《HTML及基本結(jié)構(gòu)》word版_第3頁
《HTML及基本結(jié)構(gòu)》word版_第4頁
《HTML及基本結(jié)構(gòu)》word版_第5頁
免費(fèi)預(yù)覽已結(jié)束，剩余1頁可下載查看

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

1、.HTML的基本結(jié)構(gòu)在當(dāng)今社會(huì)中，網(wǎng)絡(luò)已成為人們生活的一部分，網(wǎng)絡(luò)提供的服務(wù)主要是以網(wǎng)頁的形式展現(xiàn)出來。HTML是創(chuàng)建網(wǎng)頁的基礎(chǔ)語言，如果不了解HTML（超文本標(biāo)記語言）就談不上網(wǎng)頁設(shè)計(jì)。HTML也是Web用于創(chuàng)建和識(shí)別文檔的標(biāo)準(zhǔn)語言。這些標(biāo)記都是通過使用標(biāo)簽來完成的，標(biāo)簽可指定網(wǎng)頁在瀏覽器中的顯示方式。本章就來介紹HTML文件的基本結(jié)構(gòu)、文本相關(guān)標(biāo)簽、圖像<IMG>標(biāo)簽、頁面鏈接<A>標(biāo)簽、滾動(dòng)<MARQUEE>標(biāo)簽等，使大家對(duì)HTML的基本標(biāo)簽有深入的了解，為后面的學(xué)習(xí)打下堅(jiān)實(shí)的基礎(chǔ)，其中重點(diǎn)是文本、圖像、鏈接標(biāo)簽的運(yùn)用，難點(diǎn)是各種標(biāo)簽的綜合應(yīng)用。本節(jié)單

2、詞記憶：標(biāo)簽 1.head 2.title 3.body 4.meta 屬性 1.bgcolor 2.background網(wǎng)頁學(xué)習(xí)網(wǎng)提示：html語言非常簡(jiǎn)單，不需要邏輯理解，而絕大部分朋友覺得它難以掌握，90%的原因在于英語單詞不過關(guān)，所以每節(jié)記憶幾個(gè)單詞是非常有必要的。1.1 HTML的基本機(jī)構(gòu)完整的HTML文件至少包括<HTML>標(biāo)簽、<HEAD>標(biāo)簽、<TITLE>標(biāo)簽和<BODY>標(biāo)簽，并且這些標(biāo)簽都是成對(duì)出現(xiàn)的，開頭標(biāo)簽為<>，結(jié)束標(biāo)簽為</>，在這兩個(gè)標(biāo)簽之間添加內(nèi)容。通過這些標(biāo)簽中的相關(guān)屬性可以設(shè)置頁面的背

3、景色、背景圖像等。1. HTML文檔的結(jié)構(gòu)HTML文檔主要由3部分組成。HTML部分：HTML部分以<HTML>標(biāo)簽開始，以<HTML>標(biāo)簽結(jié)束。<HTML></HTML><HTML>標(biāo)簽告訴瀏覽器這兩個(gè)標(biāo)簽中間的內(nèi)容是HTML文檔。頭部：頭部以<HEAD>標(biāo)簽開始，以</HEAD>標(biāo)簽結(jié)束。這部分包含顯示在網(wǎng)頁標(biāo)題欄中的標(biāo)題和其他在網(wǎng)頁中不顯示的信息。標(biāo)題包含在<TITLE>和<TITLE>標(biāo)簽之間。<HEAD><TITLE></TITLE><

4、/HEAD>主體部分：主體部分包含在網(wǎng)頁中顯示的文本、圖像和鏈接。主體部分以<BODY>標(biāo)簽開始，以</BODY>標(biāo)簽結(jié)束。<BODY></BODY>小經(jīng)驗(yàn)：標(biāo)簽不區(qū)分大小寫，因此用戶可以使用<html>來代替<HTML>。 圖1 HTML文檔結(jié)構(gòu) 2 使用記事本創(chuàng)建網(wǎng)頁創(chuàng)建一個(gè)HTML文檔，需要兩個(gè)工具：一個(gè)是文本編輯器（如記事本、UltraEdit、Editplus等），一個(gè)是用于查看HTML文檔效果的Web瀏覽器（如Intemet Explorer、Firefox等）。下面網(wǎng)頁學(xué)習(xí)網(wǎng)就使用W

5、indows自帶的記事本來快速編寫第一個(gè)HTML文件，然后使用Web瀏覽器查看HTML文檔效果。(1)  單擊“開始”一“程序”一“附件”一“記事本”菜單或者右擊鼠標(biāo)選擇“新建”一“文本文檔”命令，打開記事本程序。(2)  在記事本中輸入如圖2所示的HTML代碼，輸入完代碼后的記事本如圖1.2所示。圖2 在記事本里編輯HTML(3)  單擊記事本菜單欄中的“文件一保存”菜單，彈出“另存為”對(duì)話框，在對(duì)話框中選擇存盤的文件夾，然后在“保存類型”下拉列表框中選擇“所有文件”選項(xiàng)，在“編碼”下拉列表框中選擇“ANSI”選項(xiàng)，保存文件名為my_firstPage.html

6、，如圖3所示，最后單擊“保存”按鈕。(4) 回到存盤的文件夾，使用Web瀏覽器打開my_firstPage.html丈件，可以看到最終的頁面效果，如圖4所示。WANGYEXX.COM 圖4 “另存為”對(duì)話框     圖5 瀏覽效果3 <META>標(biāo)簽<META>標(biāo)簽出現(xiàn)在網(wǎng)頁的標(biāo)題部分。這是一個(gè)特殊的HTML標(biāo)簽，提供有關(guān)網(wǎng)頁的信息。有時(shí)在網(wǎng)上沖浪時(shí)，發(fā)現(xiàn)有些網(wǎng)頁中的文字是亂碼，這是怎么回事呢？其實(shí)就是<META>標(biāo)簽中charset屬性沒有正確地設(shè)置編碼語系。如果我們正確地設(shè)置了網(wǎng)頁語言的編碼方式，瀏覽器就

7、會(huì)正確地顯示網(wǎng)頁中的內(nèi)容，而不會(huì)出現(xiàn)亂碼。要將gb2312指定為默認(rèn)字符集類型，則使用以下<META>標(biāo)簽：<HEAD><META http-equiv="Content-Type" content="text/html; charset=gb2312"><TITLE>網(wǎng)頁標(biāo)題</TITLE></HEAD>其中，charset用于設(shè)置網(wǎng)頁的編碼語系，簡(jiǎn)體中文網(wǎng)頁使用charset=gb2312，繁體中文使用charset=big5，純英文網(wǎng)頁建議使用iso-8859-1，或者不設(shè)編碼

8、也可。根據(jù)自己所在的國(guó)家或頁面主體使用的語言類型所對(duì)應(yīng)的編碼語系來正確地設(shè)置charset，這樣可以避免網(wǎng)頁中的亂碼。像在中國(guó)建議把charset設(shè)為“gb2312”。4  頁面背景色或背景圖像在默認(rèn)情況下，使用Web瀏覽器瀏覽網(wǎng)頁時(shí)，其背景色為白色，如果我想把背景色換成好看的顏色或圖片怎么辦？其實(shí)很簡(jiǎn)單，使用bgcolor屬性可以改變網(wǎng)頁的背景色，使用background屬性可以把網(wǎng)頁的背景設(shè)為圖片。語法：設(shè)置網(wǎng)頁的背景色或背景圖像：<BODY bgcolor="#FFCCFF" background="back_image.GIF"&

9、gt;    Hello World!</BODY>示例1：設(shè)置網(wǎng)頁背景的代碼。<HTML><HEAD><META http-equiv="Content-Type" content="text/html; charset=gb2312"><TITLE>我的主頁</TITLE></HEAD><BODY bgcolor="#FFCCFF">    Hello World</BODY></HTML>示例1在瀏覽器中預(yù)覽效果如圖1.5所示。若把示例l中<BODY bgcolor="#FFCCFF">這一部分代碼改為<BODY background="back_image.GIF">之后，在瀏覽器中預(yù)覽效果如圖6所示。圖6 設(shè)置網(wǎng)頁的背景圖像小經(jīng)驗(yàn)：為了使頁面美觀大方，網(wǎng)頁背景要盡量得淺。本節(jié)作業(yè)：參照示例1，通過記事本創(chuàng)建一個(gè)簡(jiǎn)單的HTML頁面，要求設(shè)置網(wǎng)頁背景。注

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論