# HTML Cheatsheet
## ==Basic Tags==
- `<html> </html>`：建立HTML文件。
- `<head> </head>`：包含標題和其他不顯示的信息。
- `<body> </body>`：包含文檔的可見部分。
- `<title> </title>`：將文檔名稱顯示在標題欄中，書籤時使用的名稱。
---
## ==Body attributes (only used in email newsletters)==
- `<body bgcolor=?>`：設置背景顏色，使用名稱或十六進位值
- `<body text=?>`：設置文本顏色，使用名稱或十六進位值
- `<body link=?>`：設置鏈接顏色，使用名稱或十六進位值
- `<body vlink=?>`：設置訪問過的鏈接顏色，使用名稱或十六進位值
- `<body alink=?>`：設置活動鏈接的顏色（鼠標點擊時）
---
## ==Text Tags==
- `<pre> </pre>`：創建預格式化文本
- `<h1> </h1>` 到 `<h6> </h6>`：創建標題 - H1最大，H6最小
- `<b> </b>`：創建粗體文本（應使用 `<strong>`）
- `<i> </i>`：創建斜體文本（應使用 `<em>`）
- `<tt> </tt>`：創建打字機風格文本
- `<code> </code>`：用於定義源代碼，通常是等寬字型
- `<cite> </cite>`：創建引用，通常以斜體形式顯示
- `<address> </address>`：創建地址部分，通常以斜體形式顯示
- `<em> </em>`：強調一個單詞（通常以斜體形式顯示）
- `<strong> </strong>`：強調一個單詞（通常以粗體形式顯示）
- `<font size=?> </font>`：設置字體大小 - 1到7（應使用CSS）
- `<font color=?> </font>`：設置字體顏色（應使用CSS）
- `<font face=?> </font>`：定義使用的字體（應使用CSS）
---
## ==Links==
- `<a href="URL">可點擊的文本</a>`：創建到統一資源定位符的超鏈接
- `<a href="mailto:EMAIL_ADDRESS">可點擊的文本</a>`：創建到電子郵件地址的超鏈接
- `<a name="NAME">`：創建文檔內的目標位置
- `<a href="#NAME">可點擊的文本</a>`：創建到該目標位置的鏈接
---
## ==Formatting==
- `<p> </p>`：創建新的段落
- `<br>`：插入換行符（回車）
- `<blockquote> </blockquote>`：將內容放在引用中 - 使文本兩側縮進
- `<div> </div>`：用於使用CSS格式化塊內容
- `<span> </span>`：用於使用CSS格式化內聯內容
---
## ==Lists==
- `<ul> </ul>`：創建無序列表
- `<ol start=?> </ol>`：創建有序列表（start=xx，其中xx是計數數字）
- `<li> </li>`：包圍每個列表項目
- `<dl> </dl>`：創建定義列表
- `<dt>`：在每個定義詞的前面
- `<dd>`：在每個定義的前面
---
## ==Graphical elements==
- `<hr>`：插入水平線
- `<hr size=?>`：設置水平線的大小（高度）
- `<hr width=?>`：設置線的寬度（作為百分比或絕對像素長度）
- `<hr noshade>`：創建沒有陰影的水平線
- `<img src="URL" align=? border=? height=? width=? alt=?>`：添加圖像；它是位於URL的單獨文件
- 將圖像對齊到左側/右側/中心/底部/頂部/中部（使用CSS）
- 設置圖像周圍的邊框的大小（使用CSS）
- 設置圖像的高度，以像素為單位
- 設置圖像的寬度，以像素為單位
- 為無法處理圖像的瀏覽器設置替代文本（ADA要求）
---
## ==Forms==
- `<form> </form>`：定義表單
- `<select multiple name=? size=?> </select>`：創建一個滾動菜單。Size設置可見菜單項目的數量，用戶需要滾動。
- `<select name=?> </select>`：創建下拉菜單
- `<option>`：設置每個菜單項目
- `<textarea name=? cols="x" rows="y"></textarea>`：創建文本框區域。列設置寬度；行設置高度。
- `<input type="checkbox" name=? value=?>`：創建複選框。
- `<input type="checkbox" name=? value=? checked>`：創建預先選中的複選框。
- `<input type="radio" name=? value=?>`：創建單選按鈕。
- `<input type="radio" name=? value=? checked>`：創建預先選中的單選按鈕。
- `<input type="text" name=? size=?>`：創建一行文本區域。Size設置長度，以字符為單位。
- `<input type="submit" value=?>`：創建提交按鈕。Value設置提交按鈕上的文本。
- `<input type="image" name=? src=? border=? alt=?>`：使用圖像創建提交按鈕。
- `<input type="reset">`：創建重置按鈕
---
## ==Tables (use only for data layout - use CSS for page layout)==
- `<table> </table>`：創建表格
- `<tr> </tr>`：設置表格中每行
- `<td> </td>`：設置行中的每個單元格
- `<th> </th>`：設置表頭（正常單元格，加粗，居中文本）
---
## ==HTML5 input tag attributes==
（不是所有瀏覽器都支持; 請訪問http://caniuse.com了解詳情）
- `<input type="email" name=?>`：設置電子郵件地址的單行文本框
- `<input type="url" name=?>`：設置URL的單行文本框
- `<input type="number" name=?>`：設置數字的單行文本框
- `<input type="range" name=?>`：設置一系列數字的單行文本框
- `<input type="date/month/week/time" name=?>`：顯示包含日期/月份/周/時間的日曆的單行文本框
- `<input type="search" name=?>`：用於搜索的單行文本框
- `<input type="color" name=?>`：用於選擇顏色的單行文本框
---
## ==Table attributes (only use for email newsletters)==
- `<table border=?>`：設置表格單元格周圍的邊框寬度
- `<table cellspacing=?>`：設置表格單元格之間的空間量
- `<table cellpadding=?>`：設置單元格邊框和其內容之間的空間量
- `<table width=?>`：設置表格的寬度，以像素或百分比為單位
- `<tr align=?>`：設置行內的單元格對齊（左/中/右）
- `<td align=?>`：設置單元格對齊（左/中/右）
- `<tr valign=?>`：設置行內的單元格垂直對齊（頂部/中部/底部）
- `<td valign=?>`：設置單元格的垂直對齊（頂部/中部/底部）
- `<td rowspan=?>`：設置單元格應跨越的行數（默認=1）
- `<td colspan=?>`：設置單元格應跨越的列數
- `<td nowrap>`：防止單元格內的行被打破以適應
{"title":"HTML CheatSheet 中文","description":"HTML Cheatsheet","contributors":"[{\"id\":\"7d4a2a9e-65b0-44e8-b141-81cadf2036b6\",\"add\":7401,\"del\":3742}]"}