HTML5基礎(chǔ)-教學(xué)講解課件_第1頁(yè)
HTML5基礎(chǔ)-教學(xué)講解課件_第2頁(yè)
HTML5基礎(chǔ)-教學(xué)講解課件_第3頁(yè)
HTML5基礎(chǔ)-教學(xué)講解課件_第4頁(yè)
HTML5基礎(chǔ)-教學(xué)講解課件_第5頁(yè)
已閱讀5頁(yè)，還剩21頁(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)介

HTML基礎(chǔ)本章學(xué)習(xí)目標(biāo)Web前端開(kāi)發(fā)工程師應(yīng)掌握以下內(nèi)容：了解HTML文檔的基本結(jié)構(gòu)；理解標(biāo)記類型、標(biāo)記語(yǔ)法；學(xué)會(huì)body標(biāo)記的屬性的設(shè)置方法；學(xué)會(huì)給網(wǎng)頁(yè)添加注釋；理解meta元信息的作用；了解HTML文檔類型。HTML文檔結(jié)構(gòu)1基本結(jié)構(gòu)一個(gè)完整的HTML文檔由頭部head和主體body兩個(gè)部分組成。在頭部<head>標(biāo)記中，可定義標(biāo)題、樣式等；在主體<body>標(biāo)記中，可定義段落、標(biāo)題字、超鏈接、腳本、表格、表單等元素，主體內(nèi)容是網(wǎng)頁(yè)要顯示的信息。<html><head></head><body></body></html>頭部<head>HTML文檔的頭部標(biāo)記主要包含頁(yè)面標(biāo)題標(biāo)記、元信息標(biāo)記、樣式標(biāo)記、腳本標(biāo)記、鏈接標(biāo)記等。頭部標(biāo)記所包含的信息一般不會(huì)顯示在網(wǎng)頁(yè)上。1頁(yè)面標(biāo)題<title>

基本語(yǔ)法

<title>標(biāo)題信息顯示在瀏覽器的標(biāo)題欄上</title>

語(yǔ)法說(shuō)明title標(biāo)記是雙標(biāo)記，<title>是開(kāi)始標(biāo)記，</title>是結(jié)束標(biāo)記，兩者之間的內(nèi)容為顯示在瀏覽器的標(biāo)題欄上的信息。標(biāo)題title標(biāo)記應(yīng)用元信息<meta>META標(biāo)記用來(lái)描述一個(gè)HTML網(wǎng)頁(yè)文檔的屬性，也稱為元信息（meta-information），這些信息并不會(huì)顯示在瀏覽器的頁(yè)面中。例如作者、日期和時(shí)間、網(wǎng)頁(yè)描述、關(guān)鍵詞、頁(yè)面刷新等。1.<meta>標(biāo)記基本語(yǔ)法

<metaname=""content="">

<metahttp-equiv=""content="">

屬性說(shuō)明

meta屬性主要分為兩組：name屬性與content屬性name屬性用于描述網(wǎng)頁(yè)，它是以“名稱/值”形式的名稱，name屬性的值所描述的內(nèi)容(值)通過(guò)content屬性表示，便于搜索引擎機(jī)器人查找、分類。其中最重要的是description、keywords。http-equiv屬性與content屬性http-equiv屬性用于提供HTTP協(xié)議的響應(yīng)頭報(bào)文(MIME文檔頭)，它是以“名稱/值”形式的名稱，http-equiv屬性的值所描述的內(nèi)容(值)通過(guò)content屬性表示，通常為網(wǎng)頁(yè)加載前提供給瀏覽器等設(shè)備使用。其中最重要的是content-typecharset提供編碼信息，refresh刷新與跳轉(zhuǎn)頁(yè)面，no-cache頁(yè)面緩存，expires網(wǎng)頁(yè)緩存過(guò)期時(shí)間。meta標(biāo)記屬性/值對(duì)應(yīng)表

2.meta標(biāo)記的使用方法<metaname="keywords"content="信息參數(shù)"/><metaname="description"content="信息參數(shù)"/><metaname="generator“content="信息參數(shù)"/><metaname="author"content="信息參數(shù)"><metaname="robots"contect="信息參數(shù)"><metahttp-equiv="content-type"content="text/html;charset=信息參數(shù)"/><metahttp-equiv=“refresh”content=“時(shí)間；url=網(wǎng)址參數(shù)">元信息<meta>(續(xù))主體body主體body是一個(gè)Web頁(yè)面的主要部分，其設(shè)置內(nèi)容是讀者實(shí)際看到的信息。所有WWW文檔的主體部分都是由body標(biāo)記定義的。在主體body標(biāo)記中可以放置的是頁(yè)面中所有的內(nèi)容，如圖片、圖像、表格、文字、超鏈接等元素。1body標(biāo)記基本語(yǔ)法

<body></body>語(yǔ)法說(shuō)明＜body＞是開(kāi)始標(biāo)記，＜/body＞是結(jié)束標(biāo)記。兩者之間所包括的內(nèi)容為網(wǎng)頁(yè)上顯示的信息。在主體body標(biāo)記中插入相關(guān)標(biāo)記body標(biāo)記屬性設(shè)置body標(biāo)記屬性可以改變Web頁(yè)面顯示效果。body標(biāo)記主要屬性有text、bgcolor、background、link、alink、vlink、topmargin、leftmargin?；菊Z(yǔ)法<bodyleftmargin="50px"topmargin="50px"text="#000000"bgcolor="#339999"link="blue"alink="white"vlink="red"background="body_image.jpg">屬性說(shuō)明Body標(biāo)記屬性表HTML中顏色表示方法在網(wǎng)頁(yè)設(shè)計(jì)中，HTML提供了4種顏色設(shè)置方法：使用RGB（R，G，B），其中R、G、B是整數(shù)，取值范圍：0～255；使用RGB（R%，G%，B%），其中R、G、B是整數(shù)，取值范圍：0～100；使用十六進(jìn)制數(shù)#RRGGBB，R、G、B為十六進(jìn)制數(shù)，取值范圍：0～9、A～F，每一種顏色用2位十六進(jìn)制數(shù)表示，RR表示紅色部分，GG表示綠色部分，BB表示藍(lán)色部分。要表示紅色的值，表示方法為#FF0000；使用顏色英文名稱，如red表示紅色，green表示綠色，blue表示藍(lán)色等。主體body標(biāo)記屬性應(yīng)用HTML基本語(yǔ)法1標(biāo)記語(yǔ)法HTML用于描述功能的符號(hào)成為“標(biāo)記”（Tag），也可稱為“標(biāo)簽”，本書(shū)統(tǒng)一約定為標(biāo)記。<html>、<head>、<body>等都是標(biāo)記。標(biāo)記通常分為單標(biāo)記和雙標(biāo)記兩種類型。1.單標(biāo)記單標(biāo)記僅單獨(dú)使用就可以表達(dá)完整的意思。W3C（萬(wàn)維網(wǎng)聯(lián)盟）定義的新標(biāo)準(zhǔn)(XHTML1.0/HTML4.01)建議單標(biāo)記應(yīng)以/結(jié)尾，即<標(biāo)記名稱/>。基本語(yǔ)法

<標(biāo)記名稱>或<標(biāo)記名稱/>

語(yǔ)法說(shuō)明最常用的單標(biāo)記有<br>、<hr>。<br>、<br/>表示換行，<hr>、<hr/>表示水平分隔線。HTML基本語(yǔ)法（續(xù)）2.雙標(biāo)記雙標(biāo)記由開(kāi)始標(biāo)記和結(jié)束標(biāo)記兩部分組成，必須成對(duì)使用。開(kāi)始標(biāo)記也稱為首標(biāo)記，告訴Web瀏覽器從此處開(kāi)始執(zhí)行該標(biāo)記所表示的功能；結(jié)束標(biāo)記也稱為尾標(biāo)記，告訴Web瀏覽器在這里結(jié)束該標(biāo)記。基本語(yǔ)法

<標(biāo)記名稱>內(nèi)容</標(biāo)記名稱>語(yǔ)法說(shuō)明其中“內(nèi)容”部分就是要被這對(duì)標(biāo)記施加作用的部分。

<h3><i>這是錯(cuò)誤的交叉嵌套的代碼</h3></i>×<h3><i>這是正確嵌套不交叉的代碼</i></h3>√屬性語(yǔ)法基本語(yǔ)法<標(biāo)記名稱屬性名1="屬性值"屬性名2="屬性值"…

屬性名n="屬性值n">基本語(yǔ)法屬性應(yīng)在開(kāi)始標(biāo)記（首標(biāo)記）內(nèi)定義，并且和標(biāo)記名之間有一個(gè)空格分隔。例如，上例中hr標(biāo)記中，align為屬性，center為屬性值，屬性值可以直接書(shū)寫(xiě)，也可以使用雙引號(hào)“”括起來(lái)。

<hrsize="3"color="red"align="center">標(biāo)記語(yǔ)法及屬性語(yǔ)法應(yīng)用注釋HTML代碼中添加注釋的方法有2種：<!--注釋信息

--><comment>注釋信息</comment>1.<!--注釋信息-->基本語(yǔ)法<!--顯示一個(gè)段落-->

語(yǔ)法說(shuō)明以左尖括號(hào)和感嘆號(hào)組合開(kāi)始（<!--），以右尖括號(hào)（-->）結(jié)束。注釋（續(xù)）2.<comment>標(biāo)記基本語(yǔ)法<comment>顯示一個(gè)段落</comment>

語(yǔ)法說(shuō)明comment標(biāo)記是雙標(biāo)記，以<comment>開(kāi)始，以</comment>結(jié)束。標(biāo)記包圍的信息為注釋內(nèi)容。

<comment>顯示一個(gè)段落</comment>HTML文檔編寫(xiě)規(guī)范1HTML頁(yè)面編碼基本規(guī)范1.所有標(biāo)記均以“<”開(kāi)始、以“>”結(jié)束。2.根據(jù)標(biāo)記類型，正確輸入標(biāo)記，單標(biāo)記最好在右尖括號(hào)前加1個(gè)斜杠“/”，如換行標(biāo)記是單標(biāo)記<br/>，雙標(biāo)記最好同時(shí)輸入起始標(biāo)記和結(jié)束標(biāo)記，以免忘記。3.標(biāo)記可以嵌套使用，但不能交叉使用。4.在HTML代碼中不區(qū)分大小寫(xiě)。6.標(biāo)記中可以設(shè)置各種屬性，屬性值建議用雙引號(hào)標(biāo)注起來(lái)7.書(shū)寫(xiě)開(kāi)始與結(jié)束標(biāo)記時(shí)，在左尖括號(hào)與標(biāo)記名或與斜杠“/”之間不能留有多余空格，否則瀏覽器標(biāo)記不能識(shí)別，導(dǎo)致錯(cuò)誤標(biāo)記直接顯示在頁(yè)面上，影響頁(yè)面美觀效果。8.編寫(xiě)HTML代碼時(shí)，應(yīng)該使用鋸齒結(jié)構(gòu)，即采用縮進(jìn)風(fēng)格，使代碼結(jié)構(gòu)清晰，便于理解和分析頁(yè)面的結(jié)構(gòu)，便于代碼后期閱讀和維護(hù)。2HTML文件命名規(guī)則1.文件的擴(kuò)展名為html或者h(yuǎn)tm，建議統(tǒng)一用html作為文件名的后綴。2.文件名中只可由英文字母、數(shù)字或下劃線組成，建議以字母或下劃線開(kāi)始。3.文件名中不能包含特殊符號(hào)，如空格、$、&等。4.文件名區(qū)分大小寫(xiě)，特別在Unix、Linux系統(tǒng)中大小寫(xiě)表示的文件是不同。5.網(wǎng)站首頁(yè)文件名一般是index.html或default.html。綜合實(shí)例

本章小結(jié)本章主要介紹了HTML文件的基本結(jié)構(gòu)。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)論