網(wǎng)頁(yè)設(shè)計(jì)與開(kāi)發(fā)實(shí)驗(yàn)課件第2章 HTML基礎(chǔ)介紹_第1頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與開(kāi)發(fā)實(shí)驗(yàn)課件第2章 HTML基礎(chǔ)介紹_第2頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與開(kāi)發(fā)實(shí)驗(yàn)課件第2章 HTML基礎(chǔ)介紹_第3頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與開(kāi)發(fā)實(shí)驗(yàn)課件第2章 HTML基礎(chǔ)介紹_第4頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與開(kāi)發(fā)實(shí)驗(yàn)課件第2章 HTML基礎(chǔ)介紹_第5頁(yè)
已閱讀5頁(yè)，還剩17頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡(jiǎn)介

主要內(nèi)容了解HTML文檔的基本結(jié)構(gòu)了解標(biāo)記屬性的使用方法和規(guī)則2.1HTML文檔結(jié)構(gòu)一個(gè)完整的HTML文件包含頭部和主體兩個(gè)部分的內(nèi)容，在頭部?jī)?nèi)容里，可定義標(biāo)題、樣式等，文檔的主體內(nèi)容就是要顯示的信息。<!--程序2-1--><html><head><title>一個(gè)簡(jiǎn)單的HTML示例</title></head><body><h1>歡迎光臨我的主頁(yè)</h1></body></html>2.1.2頭部?jī)?nèi)容<head>…</head>HTML文檔的頭部標(biāo)記,在瀏覽器窗口中，頭部信息是不被顯示在正文中的，在此標(biāo)記中可以插入其它用以說(shuō)明文件的標(biāo)題和一些公共屬性的標(biāo)記。head部分允許的標(biāo)記根據(jù)HTML標(biāo)準(zhǔn)，僅有<base>,<link>,<meta>,<title>,<style>和<script>幾個(gè)標(biāo)簽在HTML的頭部分是合法的。Title如要指定HTML文檔的網(wǎng)頁(yè)標(biāo)題（它將顯示在瀏覽器窗口頂部標(biāo)題欄），就要在頭部?jī)?nèi)容中提供有關(guān)信息。用title元素來(lái)指定網(wǎng)頁(yè)標(biāo)題，即在<title></title>之間寫上網(wǎng)頁(yè)標(biāo)題，如程序2-2。2.1.2頭部?jī)?nèi)容<!--程序2-2--><html><head>

<title>我的第一個(gè)網(wǎng)站</title></head><body></body></html>2.1.2頭部?jī)?nèi)容2.1.2頭部?jī)?nèi)容<META>元素可提供有關(guān)頁(yè)面的元信息（meta-information），META標(biāo)簽分兩大部分：HTTP標(biāo)題信息(HTTP-EQUIV)和頁(yè)面描述信息(NAME)。例如加入關(guān)鍵字會(huì)自動(dòng)被大型搜索網(wǎng)站自動(dòng)搜集；可以設(shè)定頁(yè)面格式及刷新等等。這些定義的內(nèi)容并不在網(wǎng)頁(yè)頁(yè)面中顯示。但他們會(huì)有一些特殊的作用。＜head＞

<metahttp-equiv="content-Type"content="text/html;charset=gb2312"><metaname="Keywords"content="教育,就業(yè),計(jì)算機(jī)">

<metaname="Description"content="教育,就業(yè),計(jì)算機(jī)">＜/head＞2.1.2頭部?jī)?nèi)容META的屬性content：定義與http-equiv或name屬性相關(guān)的元信息http-equiv：把content屬性關(guān)聯(lián)到HTTP頭部，取值范圍包括：content-type，expires，refresh，set-cookiename：把content屬性關(guān)聯(lián)到一個(gè)名稱。取值范圍：author、description、keywords、generator、Robots等http-equiv屬性使用帶有http-equiv屬性的<meta>標(biāo)簽時(shí)，服務(wù)器將把名稱/值對(duì)添加到發(fā)送給瀏覽器的內(nèi)容頭部。例如，添加：＜head＞<metahttp-equiv="charset"content=“text/html;charset=gb2312"><metahttp-equiv="expires"content="31Dec2011">＜/head＞content-type:text/htmlcharset:gb2312expires:31Dec20112.1.3主體內(nèi)容在標(biāo)記<body>和</body>中放置的是頁(yè)面中所有的內(nèi)容，如圖片、文字、表格、表單、超鏈接等元素。例如，程序2-4在body部分添加了幾個(gè)關(guān)于文本和段落的標(biāo)記。

2.1.3主體內(nèi)容<!--程序2-4--><html><head><title>我的第一個(gè)頁(yè)面</title></head><body><h1>這里是文章的標(biāo)題。</h1><p>這里是文章的段落。</p></body></html>2.1.4編寫網(wǎng)頁(yè)的開(kāi)頭可以通過(guò)瀏覽器直接查看一個(gè)頁(yè)面的HTML源代碼，例如在IE瀏覽器菜單欄上選擇“查看

源文件”即可。大多頁(yè)面的開(kāi)頭，通常使用DOCTYPE標(biāo)記來(lái)聲明要使用什么風(fēng)格的HTML或XHTML。DOCTYPE使瀏覽器知道應(yīng)該如何處理文檔，并且讓驗(yàn)證器知道按照什么樣的標(biāo)準(zhǔn)檢查代碼的語(yǔ)法。然后，用html標(biāo)記標(biāo)出實(shí)際代碼的起始位置。2.2HTML基本語(yǔ)法HTML用于描述功能的符號(hào)稱為“標(biāo)記”。<html>、<head>、<body>等都是標(biāo)記。標(biāo)記通常分為單標(biāo)記和雙標(biāo)記兩種類型。2.2.1標(biāo)記語(yǔ)法單標(biāo)記單標(biāo)記僅單獨(dú)使用就可以表達(dá)完整的意思?；菊Z(yǔ)法：<標(biāo)記名稱>語(yǔ)法說(shuō)明：最常用的單標(biāo)記是<br>,它表示換行。2.2.1標(biāo)記語(yǔ)法

雙標(biāo)記雙標(biāo)記由首標(biāo)記和尾標(biāo)記兩部分構(gòu)成，它必須成對(duì)使用。首標(biāo)記告訴Web瀏覽器從此處開(kāi)始執(zhí)行該標(biāo)記所表示的功能。尾標(biāo)記告訴Web瀏覽器在這里結(jié)束該標(biāo)記?；菊Z(yǔ)法：<標(biāo)記名稱>內(nèi)容</標(biāo)記名稱>語(yǔ)法說(shuō)明：其中“內(nèi)容”部分就是要被這對(duì)標(biāo)記施加作用的部分。例如，“b“標(biāo)記的作用是，告訴瀏覽器介于標(biāo)記<b>和</b>之間的文本應(yīng)以粗體顯示。（這里的“b”是“粗體（bold）”的意思。標(biāo)記可以包含標(biāo)記，即標(biāo)記可以成對(duì)嵌套，但是不能交叉地嵌套。下面的代碼就是錯(cuò)誤的：<B><I>這是錯(cuò)誤的交叉嵌套代碼</B></I>。2.2.2屬性語(yǔ)法HTML通過(guò)標(biāo)記告訴瀏覽器如何展示網(wǎng)頁(yè)，如<br>告訴瀏覽器顯示一個(gè)換行。另外還可以為某些元素附加一些信息，這些附加信息被稱為屬性（attribute）。例如，標(biāo)記<hr>的作用是在網(wǎng)頁(yè)中插入一條水平線,那么這條水平線的粗細(xì)、對(duì)齊方式等就是該標(biāo)記的屬性，如：

<hrsize="5px"align="center">2.2.2屬性語(yǔ)法基本語(yǔ)法：<標(biāo)記名稱屬性名1="屬性值"屬性名2="屬性值">語(yǔ)法說(shuō)明：屬性應(yīng)寫在首標(biāo)記內(nèi)，并且和標(biāo)記名之間有一個(gè)空格分隔。例如，上例中hr標(biāo)記中，align為屬性，center為屬性值，屬性值可以直接書寫，也可以使用""括起來(lái)。以下寫法也是正確的：

<hrsize=5pxalign=center>2.3注釋注釋標(biāo)簽用于在HTML源碼中插入注釋。注釋會(huì)被瀏覽器忽略。可以使用注釋對(duì)程序代碼進(jìn)行解釋，適當(dāng)?shù)淖⑨寣?duì)以后代碼的閱讀和維護(hù)產(chǎn)生很大的幫助。基本語(yǔ)法：

<!--注釋內(nèi)容-->語(yǔ)法說(shuō)明：左括號(hào)后需要寫一個(gè)驚嘆號(hào)，右括號(hào)前就不需要了。

<hrsize=5pxalign=center>

2.4編寫HTML文件的注意事項(xiàng)“<”和“>”是任何標(biāo)記的開(kāi)始和結(jié)束。元素的標(biāo)記要用這對(duì)尖括號(hào)括起來(lái)，并且結(jié)束的標(biāo)記總是在開(kāi)始的標(biāo)記前加一個(gè)斜杠“/”；元素必須被關(guān)閉。標(biāo)記可以嵌套使用，但不能嵌套標(biāo)記。任何回車符和空格在HTML代碼中都不起作用。為了代碼清晰，建議不同的標(biāo)記都單獨(dú)占一行；標(biāo)記中可以放置各種屬性，屬性值都用“"”括起來(lái)；標(biāo)簽名和屬性建議都用小寫字母。編寫代碼，一般應(yīng)該使用縮進(jìn)風(fēng)格，以便更好的理解頁(yè)面的結(jié)構(gòu)，便于閱讀和維護(hù)。2.4編寫HTML文件的注意事項(xiàng)為了使瀏覽器能正常瀏覽網(wǎng)頁(yè)，在用記事本或別的HTML開(kāi)發(fā)工具編寫好HTML文檔后，在保存HTML時(shí)，對(duì)HTML文件的命名要注意以下幾點(diǎn)：文件的擴(kuò)展名為.htm或.html結(jié)束，建議統(tǒng)一使用html作為文件名的后綴；文件名中只可由英文字母、數(shù)字或下劃線組成；文件名中不要包含特殊符號(hào)，比如空格、$等；文件名區(qū)分大小寫；網(wǎng)站首頁(yè)文件名一般是index.html或default.html。2.5小實(shí)例編寫一個(gè)HTML文件，在編寫的時(shí)候要注意編寫的注意事項(xiàng)，養(yǎng)成良好的編碼習(xí)慣。<!--程序2-5--><html><head><title>頁(yè)面的標(biāo)題</title></head><body><p>這是我的第一個(gè)頁(yè)面。<b>這是粗體文本。</b></p><imgsrc=”./img/welcome.jpg”></body></html>小結(jié)本章主要介紹了HTML文件的基本結(jié)構(gòu)和基本語(yǔ)法。HTML

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(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)論