HTML常用的標簽及使用總結._第1頁
HTML常用的標簽及使用總結._第2頁
HTML常用的標簽及使用總結._第3頁
HTML常用的標簽及使用總結._第4頁
HTML常用的標簽及使用總結._第5頁
已閱讀5頁,還剩6頁未讀 繼續免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

1、HTML標簽由一對尖括號“<”和“>”,以及標簽名組成。標簽分為“起始標簽”和“結束標簽”兩種。有些標簽可以不必關閉,標簽可以有自己的屬性,不區分大小寫,不能輸入多余的空格,<!- * - >表示注釋。1.HTML標題<html><head><title>標題類元素</title></head><body><h1>一級標題</h1><h2>二級標題</h2><h3>三級標題</h3><h4>四級標題</h4&g

2、t;<h5>五級標題</h5><h6六級標題</h6></body></html>2.HTML水平線<hr/><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><h6>h6</h6><hr/></body&

3、gt;</html>3.HTML注釋<!comment->注釋并不會顯示在網頁上<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><h6>h6</h6><!- hello world -><hr/></body></html>4.

4、HTML段落<p>以及段落換行<br/><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><p>hello world</p><p>hello world</p><hr/></body></html>當顯示頁面時,瀏覽

5、器會移除源代碼中多余的空格和空行。所有連續的空格或空行都會被算作一個空格。需要注意的是,HTML 代碼中的所有連續的空行(換行)也被顯示為一個空格。段落換行使用<br/><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><p>hello world</p><p>hello &l

6、t;br/> world</p><hr/></body></html>5.HTML文本格式化6.HTML超鏈接<a><a>比較重要的屬性有兩個,分別是href、targethref指定超鏈接地址target指定打開方式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head>&l

7、t;body><p>hello world</p><a href="">百度</a><hr/></body></html>7.HTML的圖像<img>使用格式:<img src="url">alt  定義當圖片無法加載時,顯示什么信息width 定義寬度,單位可以為像素  也可以為百分比height 定義高度<!DOCTYPE html><html lang="en"><h

8、ead> <meta charset="UTF-8"> <title>Title</title></head><body><p>hello world</p><a href=""><img src="l.jpg"/></a><hr/></body></html>8.HTML的表格<table>表格由<table>來定義,每行<tr> 有許多

9、單元格<td>。表頭可以使用<th><table>標簽屬性:border  定義邊框在<table>中可以嵌入<th>  <tr>  <td>等標簽<tr>   定義行<th>   定義表頭colspan  定義表頭單元格可以橫跨的列數。rowspan  定義表頭單元格橫跨的行數heardes  定義與表頭單元格相關聯的一個或者多個單元格。(html5新增)<td> 

10、  定義單元格colspan  定義單元格可以橫跨的列數。rowspan  定義單元格橫跨的行數heardes  定義與單元格相關聯的一個或者多個單元格<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><table border="1px"> <t

11、r> <th colspan="2" >name</th> <th rowspan="2">list</th> </tr> <tr> <th headers="name">first name</th> <th headers="name">last name</th> </tr></table>在瀏覽器中顯示如下:namelistfirstnamelastname另

12、外,若某個單元格為空,瀏覽器可能無法顯示出這個單元格的邊框。為了防止這種情況,可以在該單元格加一個空格占位符&nbsp。9.HTML的列表<ul>、<ol>列表分為無序列表<ul>有序列表<ol>列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等等<ul> <li>male</li> <li>female</li></ul><hr/><ol> <li>male</li> <li>female</l

13、i></ol>瀏覽器顯示為:·male1.male·female2.female10.HTML表單<from>表單是一個包含表單元素的區域。表單元素是允許用戶在表單中(比如:文本域、下拉列表、單選框、復選框等等)輸入信息的元素<form>中的屬性:action:后面加url  指定當提交表單時向何處發送表單數據method:get/post兩個值,get為明文  post為加密name:指定表單的名稱target:_blanket  _self  _parent  _top 指定網頁

14、打開方式<from>標簽中較為常用的標簽有<input>  <select>  <label>  <button>   <fieldset> 標簽可以將表單內的相關元素分組。 會在相關表單元素周圍繪制邊框。name  規定fieldset的名稱form  值:form_id   規定fieldset所屬的表單<legend>  定義了 <fieldset> 元素的標題。&

15、#160;<input>中最為常用的幾個屬性:form  后面跟所屬form的id。規定所屬的formrequired    值:required    規定必需在提交表單之前填寫輸入字段。disabled   值: disabled   disabled 屬性規定應該禁用的 <input> 元素。type:決定輸入類型text  文本域radio  單選按鈕checkbox  復選框submit  提交按鈕password  密碼

16、輸入reset  重置color  設置拾色器   html5number  定義用于輸入數字的字段(您可以設置可接受數字的限制)range  定義用于精確值不重要的輸入數字的控件(比如 slider 控件)。您也可以設置可接受數字的限制name:input元素的名稱value:input元素的值size:輸入字段的寬度pattern  規定用于驗證 <input> 元素的值的正則表達式。pattern 屬性適用于下面的 input 類型:text、search、url、tel、email 和 passwordlist&#

17、160; 值為datalist的id   該屬性引用 <datalist> 元素,其中包含 <input> 元素的預定義選項。autofocus  該屬性是一個 boolean 屬性,讓頁面載入后,input自動獲得焦點<datalist>  html5中的新特性  標簽規定了 <input> 元素可能的選項列表。<datalist> 標簽被用來在為 <input> 元素提供"自動完成"的特性。用戶能看到一個下拉列表,里邊的選項是預先定義好的,將作為用戶

18、的輸入數據。與<option>標簽配合使用 <button>  定義一個點擊按鈕form   所屬的form表單name  button名稱typebutton  該按鈕是可點擊的按鈕reset  該按鈕是重置按鈕submit  該按鈕是提交按鈕 <label>標簽為 input 元素定義標注(標記)label 元素不會向用戶呈現任何特殊效果。不過,它為鼠標用戶改進了可用性。如果您在 label 元素內點擊文本,就會觸發此控件。就是說,當用戶選擇該標簽時,瀏覽器就會自動

19、將焦點轉到和標簽相關的表單控件上for  值為某個元素的id   規定 label 與哪個表單元素綁定。form  form_id   <textarea>  name  規定textarea的名稱form    form_id  規定從屬的表單cols規定可見列數rows   規定可見行數 <select>使用<option>標簽定義下拉列表的可用選項.常見的屬性:name:指定select名稱multipl

20、e:規定可選擇多個選項 <optgroup>  用于把相關的選項組合在一起。label  為選項組規定描述。 <option> 常見的屬性:value:指定送往服務器的選項值selected:只有一個值-selected   默認選項 <keygen>  定義了表單的密鑰對生成器字段form  所屬的表單名稱name  名稱keytype  使用的加密算法rsa   默認的算法dsaes<!DOCTYPE html>&

21、lt;html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><form name="biaoge" action="/return/" method="get"> 請選擇語言: <br/><br/><input type="radio" name="

22、;language" id="jtzw" value="chinese"/><label for="jtzw">簡體中文</label><br/><br/> <input type="radio" name="language" value="english" id="eng"/><label for="eng">English</label&

23、gt;<br/><br/> 請選擇熟悉的編程語言:<br/><br/> <fieldset> <legend>編程語言</legend> <input type="checkbox" name="python" />python <input type="checkbox" name="c" />c <input type="checkbox" name="swift&qu

24、ot; />swift<br/><br/> </fieldset><br/> 請選擇地區: <select name="district"> <optgroup label="China"> <option value="shandong">山東</option> <option value="zhejiang" selected="selected">浙江</option> <option value="guangdong">廣東</option> </optgroup> <optgroup label

溫馨提示

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

評論

0/150

提交評論