html基礎(chǔ)教程_第1頁(yè)
html基礎(chǔ)教程_第2頁(yè)
html基礎(chǔ)教程_第3頁(yè)
html基礎(chǔ)教程_第4頁(yè)
html基礎(chǔ)教程_第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)介

1、什么是 HTML?HTML 是用來(lái)描述網(wǎng)頁(yè)的一種語(yǔ)言。· HTML 指的是超文本標(biāo)記語(yǔ)言· HTML 不是一種編程語(yǔ)言,而是一種標(biāo)記語(yǔ)言· 標(biāo)記語(yǔ)言是一種將文本以及文本相關(guān)的其他信息結(jié)合起來(lái),展現(xiàn)出關(guān)于文檔結(jié)構(gòu)和數(shù)據(jù)處理細(xì)節(jié)的電腦文字編碼。· 標(biāo)記語(yǔ)言是一套標(biāo)記標(biāo)簽· HTML 使用標(biāo)記標(biāo)簽來(lái)描述網(wǎng)頁(yè)HTML 標(biāo)記標(biāo)簽HTML 標(biāo)記標(biāo)簽通常被稱為 HTML 標(biāo)簽。· <hr />單標(biāo)簽· <b>文字會(huì)變粗</b>雙標(biāo)簽· 標(biāo)簽對(duì)中的第一個(gè)標(biāo)簽是開始標(biāo)簽,第二個(gè)標(biāo)簽是結(jié)束標(biāo)簽

2、83; HTML 標(biāo)簽是由尖括號(hào)包圍的關(guān)鍵詞,比如 <html>.</html>· HTML 標(biāo)簽通常是成對(duì)出現(xiàn)的,比如 <b> 和 </b>· 開始和結(jié)束標(biāo)簽也被稱為開放標(biāo)簽和閉合標(biāo)簽HTML 文檔 = 網(wǎng)頁(yè)· HTML 文檔描述網(wǎng)頁(yè)· HTML 文檔包含 HTML 標(biāo)簽和純文本· HTML 文檔也被稱為網(wǎng)頁(yè)Web 瀏覽器的作用是讀取 HTML 文檔,并以網(wǎng)頁(yè)的形式顯示出它們。瀏覽器不會(huì)顯示 HTML 標(biāo)簽,而是使用標(biāo)簽來(lái)解釋頁(yè)面的內(nèi)容:<html><body><h

3、1>My First Heading</h1><p>My first paragraph.</p></body></html>例子解釋· <html> 與 </html> 之間的文本描述網(wǎng)頁(yè)· <body> 與 </body> 之間的文本是可見的頁(yè)面內(nèi)容· <h1> 與 </h1> 之間的文本被顯示為標(biāo)題HTML文件后綴?HTML文件分為兩種格式:.htm .htmlHTML 屬性HTML 標(biāo)簽可以擁有屬性。屬性提供了有關(guān) HT

4、ML 元素的更多的信息。屬性總是以名稱/值對(duì)等的形式出現(xiàn),比如:name="value"。屬性總是在 HTML 元素的開始標(biāo)簽中規(guī)定。標(biāo)簽描述<html></html>定義 HTML 文檔。<head></head>定義HTML頭部?jī)?nèi)容<title></title>設(shè)置文檔標(biāo)題和其它在網(wǎng)頁(yè)中不顯示的信息<body></body>定義文檔的主體。<h1></h1>to<h6></h6>定義 HTML 標(biāo)題<hr />定義水

5、平線。<p></p>定義段落。<br />插入單個(gè)折行(換行)。<b></b>定義粗體文本。<em></em>定義著重文字。<center></center>定義居中的內(nèi)容。<font></font>屬性: align: 定義文本的對(duì)齊方式left,center,right bgcolor: 定義背景顏色 color: 定義文本顏色 size: 定義文本大小 title: 定義文本提示信息 face: 定義文本字體定義 HTML 字體。<u></

6、u>定義下劃線文本<big></big>定義大號(hào)字。<i></i>定義斜體字。<small></small>定義小號(hào)字。<strong></strong>定義加重語(yǔ)氣。<del></del>定義刪除字。<img />屬性:src: 圖片地址width: 寬(100)height: 高(100)border: 邊框(1)title: 提示標(biāo)題alt: 加載失敗提示圖像<ol><li></li><li></l

7、i><li></li></ol>有序列表<ul><li></li></ul>無(wú)序列表<dl><dt></dt><dd></dd></dl>自定義列表HTML <!- -> 標(biāo)簽定義注釋標(biāo)簽用來(lái)在源文檔中插入注釋。注釋會(huì)被瀏覽器忽略。實(shí)例HTML 注釋:<!-這是一段注釋。注釋不會(huì)在瀏覽器中顯示。-><p>這是一段普通的段落。</p>HTML <a> 標(biāo)簽定義和用法<a&

8、gt; 標(biāo)簽可定義錨。 <a> 元素最重要的屬性是 href 屬性,它指定鏈接的目標(biāo)。默認(rèn)瀏覽器樣式:未被訪問(wèn)的鏈接帶有下劃線而且是藍(lán)色的 已被訪問(wèn)的鏈接帶有下劃線而且是紫色的 活動(dòng)鏈接帶有下劃線而且是紅色的 實(shí)例指向 Spwy.Net 的超鏈接:<a href="">Spwy.Net</a><a href="#title">錨鏈</a><a name=”title”></a>可選的屬性屬性值描述hrefURL鏈接的目標(biāo) URL。namename規(guī)定錨的名稱。target

9、_blank _parent _self _top 在何處打開目標(biāo) URL。 HTML <link> 標(biāo)簽定義和用法<link> 標(biāo)簽定義文檔與外部資源的關(guān)系。<link> 標(biāo)簽最常見的用途是鏈接樣式表。實(shí)例鏈接一個(gè)外部樣式表:<link rel="stylesheet" type="text/css" href="theme.css" />可選的屬性屬性值描述charsetcharset定義被鏈接文檔的字符編碼方式。hrefURL定義被鏈接文檔的位置。relalternate appe

10、ndix bookmark chapter contents copyright glossary help home index next prev section start stylesheet subsection 定義當(dāng)前文檔與被鏈接文檔之間的關(guān)系。 HTML <table> 標(biāo)簽定義和用法<table> 標(biāo)簽定義 HTML 表格。簡(jiǎn)單的 HTML 表格由 table 元素以及一個(gè)或多個(gè) tr、th 或 td 元素組成。tr 元素定義表格行,th 元素定義表頭,td 元素定義表格單元。實(shí)例一個(gè)簡(jiǎn)單的 HTML 表格,包含兩行兩列:<table borde

11、r="1"> <tr> <th>頭一</th> <th>頭二</th> </tr> <tr> <td>內(nèi)容一</td> <td>內(nèi)容二</td> </tr></table>可選的屬性屬性值描述alignleft center right 不贊成使用。使用樣式代替。規(guī)定表格相對(duì)周圍元素的對(duì)齊方式。bgcolorrgb(x,x,x) #xxxxxx colorname 不贊成使用。使用樣式代替。規(guī)定表格的背景顏色。bo

12、rderpixels規(guī)定表格邊框的寬度。cellpaddingpixels % 規(guī)定單元邊沿與其內(nèi)容之間的空白。cellspacingpixels % 規(guī)定單元格之間的空白。width% pixels 規(guī)定表格的寬度。backgroundurl背景圖片HTML <tr> 標(biāo)簽定義和用法<tr> 標(biāo)簽定義 HTML 表格中的行。tr 元素包含一個(gè)或多個(gè) th 或 td 元素。HTML <td> 標(biāo)簽定義和用法<td> 標(biāo)簽定義 HTML 表格中的標(biāo)準(zhǔn)單元格。HTML 表格有兩類單元格:· 表頭單元 - 包含頭部信息(由 th 元素創(chuàng)建)

13、· 標(biāo)準(zhǔn)單元 - 包含數(shù)據(jù)(由 td 元素創(chuàng)建)可選的屬性屬性值描述alignleft right center justify char 規(guī)定單元格內(nèi)容的水平對(duì)齊方式。bgcolorrgb(x,x,x) #xxxxxx colorname 不贊成使用。使用樣式取而代之。規(guī)定單元格的背景顏色。colspannumber規(guī)定單元格可橫跨的列數(shù)。heightpixels % 不贊成使用。使用樣式取而代之。規(guī)定表格單元格的高度。rowspannumber規(guī)定單元格可橫跨的行數(shù)。valigntop middle bottom baseline 不贊成使用。使用樣式取而代之。規(guī)定單元格內(nèi)容的垂

14、直排列方式。widthpixels % 不贊成使用。使用樣式取而代之。規(guī)定表格單元格的寬度。backgroundurl背景圖片HTML <th> 標(biāo)簽定義和用法定義表格內(nèi)的表頭單元格。HTML 表單中有兩種類型的單元格:· 表頭單元格 - 包含表頭信息(由 th 元素創(chuàng)建) · 標(biāo)準(zhǔn)單元格 - 包含數(shù)據(jù)(由 td 元素創(chuàng)建) 屬性與td一致。HTML <iframe> 標(biāo)簽定義和用法iframe 元素會(huì)創(chuàng)建包含另外一個(gè)文檔的內(nèi)聯(lián)框架(即行內(nèi)框架)??蛇x的屬性屬性值描述alignleft right top middle bottom 不贊成使用。使用

15、樣式代替。規(guī)定如何根據(jù)周圍的元素來(lái)對(duì)齊此框架。frameborder1 0 規(guī)定是否顯示框架周圍的邊框。heightpixels % 規(guī)定 iframe 的高度。nameframe_name規(guī)定 iframe 的名稱。scrollingyes no auto 規(guī)定是否在 iframe 中顯示滾動(dòng)條。srcURL規(guī)定在 iframe 中顯示的文檔的 URL。widthpixels % 定義 iframe 的寬度。HTML <form> 標(biāo)簽定義和用法<form> 標(biāo)簽用于為用戶輸入創(chuàng)建 HTML 表單。表單能夠包含 input 元素,比如文本字段、復(fù)選框、單選框、提交按鈕

16、等等。表單還可以包含textarea、和 label 元素。表單用于向服務(wù)器傳輸數(shù)據(jù)。例子<form action="login.php" method="get"> <p>用戶名: <input type="text" name="username" /></p> <p>密 碼: <input type="password" name="pwd" /></p> <input type=

17、"submit" value="登錄" /></form>必需的屬性屬性值描述actionURL規(guī)定當(dāng)提交表單時(shí),向何處發(fā)送表單數(shù)據(jù)??蛇x的屬性屬性值描述methodget post 規(guī)定如何發(fā)送表單數(shù)據(jù)。namename規(guī)定表單的名稱。target_blank _parent _self _top 規(guī)定在何處打開 action URL。HTML <input> 標(biāo)簽定義和用法<input> 標(biāo)簽用于搜集用戶信息。根據(jù)不同的 type 屬性值,輸入字段擁有很多種形式。輸入字段可以是文本字段、復(fù)選框、掩碼后的文本控

18、件、單選按鈕、按鈕等等。實(shí)例一個(gè)簡(jiǎn)單的 HTML 表單,包含兩個(gè)文本輸入框和一個(gè)提交按鈕:<form action="login.php" method="get"> 用戶名: <input type="text" name="username" /> 密 碼: <input type="password" name="pwd" /> <input type="submit" value="登錄"

19、; /></form>可選的屬性屬性值描述alttext定義圖像輸入的替代文本。checkedchecked規(guī)定此 input 元素首次加載時(shí)應(yīng)當(dāng)被選中。radiocheckboxdisableddisabled當(dāng) input 元素加載時(shí)禁用此元素。maxlengthnumber規(guī)定輸入字段中的字符的最大長(zhǎng)度。namefield_name定義 input 元素的名稱。readonlyreadonly規(guī)定輸入字段為只讀。sizenumber_of_char定義輸入字段的寬度。srcURL定義以提交按鈕形式顯示的圖像的 URL。typetext (普通文本)password (密

20、碼框)checkbox (復(fù)選框)radio (單選框)file (文件瀏覽)hidden (隱藏域)image (圖片提交按鈕)button(普通按鈕)reset (重置按鈕)submit (提交按鈕)規(guī)定 input 元素的類型。valuevalue規(guī)定 input 元素的值。HTML <textarea> 標(biāo)簽定義和用法<textarea> 標(biāo)簽定義多行的文本輸入控件。文本區(qū)中可容納無(wú)限數(shù)量的文本,其中的文本的默認(rèn)字體是等寬字體??梢酝ㄟ^(guò) cols 和 rows 屬性來(lái)規(guī)定 textarea 的尺寸,不過(guò)更好的辦法是使用 CSS 的 height 和 width

21、屬性。實(shí)例<textarea rows="3" cols="20">內(nèi)容</textarea>必需的屬性屬性值描述colsnumber規(guī)定文本區(qū)內(nèi)的可見寬度。rowsnumber規(guī)定文本區(qū)內(nèi)的可見行數(shù)??蛇x的屬性屬性值描述disableddisabled規(guī)定禁用該文本區(qū)。namename規(guī)定文本區(qū)的名稱。readonlyreadonly規(guī)定文本區(qū)為只讀。HTML <button> 標(biāo)簽定義和用法<button> 標(biāo)簽定義一個(gè)按鈕。在 button 元素內(nèi)部,您可以放置內(nèi)容,比如文本或圖像。實(shí)例以下代碼標(biāo)記了

22、一個(gè)按鈕:<button type="button">點(diǎn)擊我</button>可選的屬性屬性值描述disableddisabled規(guī)定禁用此按鈕。namename規(guī)定按鈕的名稱。typebutton reset submit 規(guī)定按鈕的類型。valuetext規(guī)定按鈕的初始值。HTML <select> 標(biāo)簽定義和用法select 元素可創(chuàng)建單選或多選菜單。當(dāng)提交表單時(shí),瀏覽器會(huì)提交選定的項(xiàng)目,或者收集用逗號(hào)分隔的多個(gè)選項(xiàng),將其合成一個(gè)單獨(dú)的參數(shù)列表,并且在將 <select> 表單數(shù)據(jù)提交給服務(wù)器時(shí)包括 name 屬性。實(shí)例

23、創(chuàng)建帶有 4 個(gè)選項(xiàng)的選擇列表:<select> <option value="php">PHP</option> <option value="cpp">C+</option> <option value="java">JAVA</option> <option value="C-sharp">C#</option></select>可選的屬性屬性值描述disableddisabled規(guī)定禁用該

24、下拉列表。multiplemultiple規(guī)定可選擇多個(gè)選項(xiàng)。namename規(guī)定下拉列表的名稱。sizenumber規(guī)定下拉列表中可見選項(xiàng)的數(shù)目。 HTML <optgroup> 標(biāo)簽定義和用法<optgroup> 標(biāo)簽定義選項(xiàng)組。optgroup 元素用于組合選項(xiàng)。當(dāng)使用一個(gè)長(zhǎng)的選項(xiàng)列表時(shí),對(duì)相關(guān)的選項(xiàng)進(jìn)行組合會(huì)使處理更加容易。實(shí)例通過(guò) <optgroup> 標(biāo)簽把相關(guān)的選項(xiàng)組合在一起:<select> <optgroup label="B/S"> <option value="php"

25、;>PHP</option> <option value="asp">ASP</option> </optgroup> <optgroup label="C/S"> <option value="cpp">C+</option> <option value="java">java</option> </optgroup></select>必需的屬性屬性值描述labeltext為選

26、項(xiàng)組規(guī)定描述??蛇x的屬性屬性值描述disableddisabled規(guī)定禁用該選項(xiàng)組。HTML <option> 標(biāo)簽定義和用法option 元素定義下拉列表中的一個(gè)選項(xiàng)(一個(gè)條目)。瀏覽器將 <option> 標(biāo)簽中的內(nèi)容作為 <select> 標(biāo)簽的菜單或是滾動(dòng)列表中的一個(gè)元素顯示。option 元素位于 select 元素內(nèi)部。實(shí)例創(chuàng)建帶有 4 個(gè)選項(xiàng)的選擇列表:<select> <option value="php">PHP</option> <option value="asp&

27、quot;>ASP</option> <option value="cpp">c+</option> <option value="csharp">C#</option></select>可選的屬性屬性值描述disableddisabled規(guī)定此選項(xiàng)應(yīng)在首次加載時(shí)被禁用。selectedselected規(guī)定選項(xiàng)(在首次顯示在列表中時(shí))表現(xiàn)為選中狀態(tài)。valuetext定義送往服務(wù)器的選項(xiàng)值。HTML <label> 標(biāo)簽定義和用法<label> 標(biāo)簽為

28、input 元素定義標(biāo)注(標(biāo)記)。<label> 標(biāo)簽的 for 屬性應(yīng)當(dāng)與相關(guān)元素的 id 屬性相同。實(shí)例帶有兩個(gè)輸入字段和相關(guān)標(biāo)記的簡(jiǎn)單 HTML 表單:<form> <label for="boy">男</label> <input type="radio" name="sex" id="boy" /> <br /> <label for="gril">女</label> <input t

29、ype="radio" name="sex" id="gril" /></form>可選的屬性屬性值描述forelement_id規(guī)定 label 與哪個(gè)表單元素綁定。 HTML <style> 標(biāo)簽定義和用法<style> 標(biāo)簽用于為 HTML 文檔定義樣式信息。在 style 中,您可以規(guī)定在瀏覽器中如何呈現(xiàn) HTML 文檔(編寫CSS語(yǔ)句)。type 屬性是必需存在,唯一的值是 "text/css"。style 元素位于 head 部分中。實(shí)例<html>

30、<head><style type="text/css">h1 color:redp color:blue</style></head><body><h1>標(biāo)題標(biāo)簽</h1><p>段落標(biāo)簽</p></body></html>HTML <div> 標(biāo)簽定義和用法<div> 可定義文檔中的分區(qū)或節(jié)。<div> 標(biāo)簽可以把文檔分割為獨(dú)立的、不同的部分。實(shí)例文檔中的一個(gè)部分會(huì)顯示為綠色:<div style="color:#00FF00"> <h3>This is a header</h3> <p>This is a paragraph.</p></div>HTML <span> 標(biāo)簽定義和用法<

溫馨提示

  • 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)論