52個HTML的標籤總結
阿新 • • 發佈：2018-12-26
HTML的52個標籤
| 編號 |
標籤名 | 含義 | 常用屬性 | 型別 |
| 1 |
<!DOCTYPE> |
宣告使用哪種html規範 |
||
| 2 |
<html></html> |
宣告頁面的開始和結束 |
xmlns:Namespace名稱空間 |
|
| 3 |
<head></head> |
頁面的頭部 |
||
| 4 |
<body></body> |
頁面的主體 |
||
| 5 |
<title></title> |
只能放在<head></head>中，用於標明頁面的標題 |
||
| 6 |
<meta/> |
放在<head></head>中，用於描述頁面的元資料 |
||
| 7 |
<b></b> |
bold 文字加粗，描述樣式 |
Xhtml中已廢棄 |
inline |
| 8 |
<strong></strong> |
文字加粗，描述語義 |
xHTML中推薦使用，代替b |
inline |
| 9 |
<i></i> |
文字斜體顯示，描述樣式 |
XHTML中已廢棄 |
inline |
| 10 |
<em></em> |
文字斜體顯示，描述語義 |
XHTML中推薦使用，代替i |
inline |
| 11 |
<sup></sup> |
上標字，描述樣式 |
inline |
|
| 12 |
<sub></sub> |
下標字，描述樣式 |
inline |
|
| 13 |
<u></u> |
underline 下劃線，描述樣式 |
inline |
|
| 14 |
<s></s> |
刪除線，描述樣式 |
inline |
|
| 15 |
h1,h2....,h6 |
標題字，描述語義 |
注意：在各個瀏覽器中預設的字型高度和的間距不一致 |
block |
| 16 |
<span></span> |
行內分割槽工具，是最簡單的內聯標籤 |
必須與CSS、JS配合使用，才會有效果 |
inline |
| 17 |
<a></a> |
錨 |
href:指定要跳轉的url、郵箱、js函式 name:指定可供停靠的錨點名稱 target:指定在哪個頁面中開啟(_self/_blank) |
inline |
| 18 |
<img/> |
通知瀏覽器此刻要向伺服器請求圖片資源 |
src:指定圖片資源的url alt:若圖片無法顯示則顯示此文字內容 width:百分比/畫素 height:百分比/畫素 title: |
inline |
| 19 |
<input type="text"/> |
單行文字輸入框 |
value:待提交的值/提示文字 name:（必需）指定輸入內容的含義 maxlength:允許輸入的最大字元數 readonly:只讀（不能修改但可提交） disable:文字域禁用（不能修改也不能提交） |
inline |
| 20 |
<input type="submit"/> |
提交按鈕，可以提交表單內容 |
inline |
|
| 21 |
<input type="radio"/> |
單選框 |
name: value: checked:表示該框已被選中 |
inline |
| 22 |
<select></select> |
下拉框 |
name: size:指定顯示的行數 multiple:表示可多選 |
inline |
| 23 |
<optgroup></optgroup> |
選項組 |
label |
inline |
| 24 |
<option></option> |
value: selected:表示選中 |
inline |
|
| 25 |
<textarea></textarea> 在開始和結束之間無value屬性 |
多行文字輸入域，只能輸入純文字 |
name: rows:顯示的行數 cols:顯示的列數 |
inline |
| 26 |
<input type="hidden"/> |
在頁面中輸入一個隱藏的文字框 |
name:(必需)隱藏欄位的名稱 value:（必需）隱藏欄位的值 |
inline |
| 27 |
<button></button> |
按鈕 |
inline |
|
| 28 |
<iframe></iframe> |
在當前頁面中嵌入另一個頁面 |
src:待嵌入頁面的url width: height: style="border:0"不顯示邊框 |
inline |
| 29 |
<meta></meta> |
度量衡 |
min: max: value: |
inline |
| 30 |
<time></time> |
為網頁內容新增日期和時間資訊 |
datetime |
inline |
| 31 |
<mark></mark> |
inline |
||
| 32 |
<label></label> |
標籤，用於給輸入域新增提示文字 |
for:指定某個輸入域的id |
inline |
| 33 |
<div></div> |
元素分組工具 ，常用於頁面佈局、內容分層，是最簡單的block元素 |
block |
|
| 34 |
<p></p> |
段落標籤，描述語義 |
block |
|
| 35 |
<br/> |
|||
| 36 |
<hr/> |
水平分割線 |
width: color: align: |
block |
| 37 |
<pre></pre> |
使用原始碼中的效果呈現內容 |
block |
|
| 38 |
<table></table> |
block |
||
| 39 |
<tr></tr> |
|||
| 40 |
<td></td> |
align:left/center/right valign:top/middle/bottom rowspan:跨越的行數 colspan:跨越的列數 |
||
| 41 |
<th></th> |
|||
| 42 |
<ul></ul> |
無序列表 |
type:disc/circle/square |
block |
| 43 |
<li></li> |
列表項 |
block |
|
| 44 |
<ol></ol> |
有序列表 |
type:1/a/A/i/I start: |
block |
| 45 |
<dl></dl> |
自定義列表 |
block |
|
| 46 |
<dt></dt> |
block |
||
| 47 |
<dd></dd> |
block |
||
| 48 |
<form></form> |
action:指定表單資料的處理頁面 method:GET/POST，前者把請求資料追加在位址列查詢字串中（有長度限制）；後者把資料以單獨的資料包傳送給伺服器（無長度限制、且可用於檔案上傳） enctype:EncodedType 表單中提交的資料的編碼型別，可取值： text/plain:表單資料不做任何編碼直接上傳 application/x-www-form-urlencoded:把表單中的資料（中文、特殊符號）編碼後再上傳，只能對字元進行編碼 multilart/form-data:以一種特殊的格式上傳字元/位元組資料 |
block |
|
| 49 |
<fieldset></fieldset> |
輸入域集合 |
block |
|
| 50 |
<detail></detail> |
詳情 |
block |
|
| 51 |
<summary></summary> |
詳情的概要 |
block |
|
| 52 |
<legend></legend> |
輸入域集合的標籤名 |
block |