HTML引用
-
<q>元素定義短的引用，瀏覽器通常會為<q>元素包圍引號。 -
<blockquote>元素定義被引用的節，瀏覽器通常會對<blockquote>元素進行縮進處理。 -
<abbr>元素定義縮寫或首字母縮略語。對縮寫進行標記能夠為瀏覽器、翻譯系統以及搜索引擎提供有用的信息。 -
<dfn>元素定義項目或縮寫的定義。如果希望簡而化之，請設置<dfn>元素的title屬性或使用<abbr>代替。 -
<address>元素定義文檔或文章的聯系信息（作者/擁有者）。
此元素通常以斜體顯示。大多數瀏覽器會在此元素前后添加折行。 -
<cite>元素定義著作的標題。瀏覽器通常會以斜體顯示 <cite> 元素。 -
<bdo>元素定義雙流向覆蓋（bi-directional override）。
<bdo> 元素定義文本方向，用于覆蓋當前文本方向：
<bdo dir="rtl">My Bolg</bdo>
gloB yM
HTML鏈接
HTML使用標簽<a>來設置超文本鏈接，使用超級鏈接與網絡上的另一個文檔相連。
默認情況下，鏈接將以以下形式出現在瀏覽器中：
- 一個未訪問過的鏈接顯示為藍色字體并帶有下劃線。
- 訪問過的鏈接顯示為紫色并帶有下劃線。
- 點擊鏈接時，鏈接顯示為紅色并帶有下劃線。
- 當把鼠標指針移動到網頁中的某個鏈接上時，箭頭會變為一只小手。
有兩種使用 <a> 標簽的方式：
- 通過使用 href 屬性（規定鏈接的目標）- 創建指向另一個文檔的鏈接。
- 通過使用 name 屬性（規定錨（anchor）的名稱）- 創建文檔內的書簽。
基本的注意事項 - 有用的提示
- 請始終將正斜杠添加到子文件夾。假如這樣書寫鏈接：
，就會向服務器產生兩次 HTTP 請求。這是因為服務器會添加正斜杠到這個地址，然后創建一個新的請求，就像這樣：。- 也可以使用 id 屬性來替代 name 屬性，命名錨同樣有效。
命名錨經常用于在大型文檔開始位置上創建目錄。可以為每個章節賦予一個命名錨，然后把鏈接到這些錨的鏈接放到文檔的上部。- 假如瀏覽器找不到已定義的命名錨，那么就會定位到文檔的頂端。不會有錯誤發生。
使用 Target 屬性，你可以定義被鏈接的文檔在何處顯示。
_blank
瀏覽器總在一個新打開、未命名的窗口中載入目標文檔。
_self
這個目標的值對所有沒有指定目標的 <a> 標簽是默認目標，它使得目標文檔載入并顯示在相同的框架或者窗口中作為源文檔。這個目標是多余且不必要的，除非和文檔標題 <base> 標簽中的 target 屬性一起使用。
_parent
這個目標使得文檔載入父窗口或者包含來超鏈接引用的框架的框架集。如果這個引用是在窗口或者在頂級框架中，那么它與目標_self 等效。
_top
這個目標使得文檔載入包含這個超鏈接的窗口，用 _top 目標將會清除所有被包含的框架并將文檔載入整個瀏覽器窗口。
提示：這些 target 的所有 4 個值都以下劃線開始。任何其他用一個下劃線作為開頭的窗口或者目標都會被瀏覽器忽略，因此，不要將下劃線作為文檔中定義的任何框架 name 或 id 的第一個字符。
使用a鏈接發送郵件：
<p>
這是一個電子郵件鏈接：
<a href="mailto:someone@example.com?cc=someoneelse@example.com&bcc=andsomeoneelse@example.com&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!" target="_top">發送郵件!</a>
</p>
<p>
<b>注意:</b> 單詞直接空格使用 %20 代替，以確保瀏覽器可以正常顯示文本。
</p>
HTML頭部
HTML <head>元素
-
<head>元素是所有頭部元素的容器。 - 在
<head>元素中你可以插入腳本（scripts）, 樣式文件（CSS），及各種meta元信息。 - 以下標簽都可以添加到 head 部分：
<title>、<base>、<link>、<meta>、<script>以及<style>。
HTML<title> 元素
-
<title>標簽定義文檔的標題。 -
<title>元素在所有 HTML/XHTML 文檔中都是必需的。 -
<title>元素能夠：
1.定義瀏覽器工具欄中的標題
2.提供頁面被添加到收藏夾時顯示的標題
3.顯示在搜索引擎結果中的頁面標題
HTML<base> 元素
-
<base>標簽為頁面上的所有鏈接規定默認地址或默認目標（target）：
<head>
<base target="_blank">
</head>
HTML<link> 元素
-
<link>標簽定義了文檔與外部資源之間的關系。 -
<link>標簽通常用于鏈接到樣式表：
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
HTML<style> 元素
-
<style>標簽用于為 HTML 文檔定義樣式信息。 - 可以在 style 元素內規定 HTML 元素在瀏覽器中呈現的樣式：
<head>
<style type="text/css">
body {background-color:red}
p {color:blue}
</style>
</head>
HTML <meta>元素
- 元數據（metadata）是關于數據的信息。
-
<meta>標簽提供關于 HTML 文檔的元數據，元數據不會顯示在頁面上，但會被瀏覽器解析。 - 元素通常用于指定網頁的描述，關鍵詞，文檔的作者、最后修改時間和其他元數據。
-
<meta>標簽始終位于 head 元素中。 - 元數據可用于瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其他 web 服務。
<meta> 標簽- 使用實例
一些搜索引擎會利用 meta 元素的 name 和 content 屬性來索引您的頁面，name 和 content 屬性的作用是描述頁面的內容。
為搜索引擎定義關鍵詞:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
為網頁定義描述內容:
<meta name="description" content="免費 Web & 編程 教程">
定義網頁作者:
<meta name="author" content="Runoob">
每30秒中刷新當前頁面:
<meta http-equiv="refresh" content="30">
HTML<script> 元素
-
<script>標簽用于定義客戶端腳本，比如 JavaScript。
HTML 圖像
圖像標簽（<img />）和源屬性（Src）
<img /> 是空標簽，意思是說，它只包含屬性，并且沒有閉合標簽。
定義圖像的語法是：
- 要在頁面上顯示圖像，需要使用源屬性src （"source"）來指明圖像的 URL 地址。
- 加載頁面時，如果頁面的圖像路徑沒有被正確設置，瀏覽器則無法加載圖片，圖像標簽就會顯示一個破碎的圖片。
替換文本屬性（Alt）
alt 屬性用來為圖像定義一串預備的可替換的文本，替換文本屬性的值是用戶自定義的。
- 在瀏覽器無法載入圖像時，替換文本屬性告訴讀者他們失去的信息。此時，瀏覽器將顯示這個替代性的文本而不是圖像。
- 為頁面上的圖像都加上替換文本屬性是個好習慣，這樣有助于更好的顯示信息，并且對于那些使用純文本瀏覽器的人來說是非常有用的。
- 指定圖像的高度和寬度的一個很好的習慣。如果圖像指定了高度寬度，頁面加載時就會保留指定的尺寸。如果沒有指定圖片的大小，加載頁面時有可能會破壞HTML頁面的整體布局。
創建圖片映射筆記：
<img>定義圖像，<map>定義圖像地圖，<area>定義圖像地圖中的可點擊區域
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>
該段代碼中的shape指的是點擊區域的形狀，coords指的應該是鏈接區域在圖片中的坐標（像素為單位）。
1、距形：(左上角頂點坐標為(x1,y1)，右下角頂點坐標為(x2,y2))
<area shape="rect" coords="x1,y1,x2,y2" href=url>
2、圓形：(圓心坐標為(X1,y1)，半徑為r)
<area shape="circle" coords="x1,y1,r" href=url>
3、多邊形：(各頂點坐標依次為(x1,y1)、(x2,y2)、(x3,y3) ......)
<area shape="poly" coords="x1,y1,x2,y2 ......" href=url>
HTML表格
表格由<table> 標簽來定義。每個表格均有若干行（由 <tr>標簽定義），每行被分割為若干單元格（由 <td>標簽定義）。
- 字母
td指表格數據（table data），即數據單元格的內容。數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。 - 如果不定義邊框屬性，表格默認將不顯示邊框。有時這很有用，但是大多數時候，我們使用
border屬性來顯示邊框。 - 表格的標題使用
<caption>標簽進行定義，位于<table>開始標簽與<tr>或<thead>標簽之間。 - 表格的表頭使用
<th>標簽進行定義，大多數瀏覽器會把表頭顯示為粗體居中的文本。 - 在一些瀏覽器中，沒有內容的表格單元顯示得不太好。如果某個單元格是空的（沒有內容），瀏覽器可能無法顯示出這個單元格的邊框。為了避免這種情況，在空單元格中添加一個
空格占位符，就可以將邊框顯示出來。 -
橫向跨列屬性：
colspan縱向跨行屬性：rowspan如果是又橫向又縱向的合并，這個時候同時標示colspan和rowspan（空格隔開）。合并后的單元格歸屬原則都是左上原則，即下歸上，右歸左，越往左上角越優先。 - 單元格邊距(
Cell padding)， 用來創建單元格內容與其邊框之間的空白。 - 單元格邊距(
Cell spacing)， 用來增加單元格之間的距離。
HTML列表
HTML 支持有序、無序和自定義列表，三種列表項內部都可以使用段落、換行符、圖片、鏈接以及其他列表等等。
有序列表
- 有序列表是一列項目，列表項目默認使用數字進行標記。
- 有序列表始于
<ol>標簽。每個列表項始于<li>標簽。 - 有序列表可根據
<ol>的type屬性的值為A、 a、 I、 i 來分別使用大寫字母，小寫字母，大寫羅馬字母，小寫羅馬字母來標記列表項目。
無序列表
- 無序列表也是一個項目的列表，默認使用粗體圓點（典型的小黑圓圈）進行標記。
- 無序列表始于
<ul>標簽。每個列表項始于<li>標簽。 - 無序列表可根據
<ul>的type屬性的值為disc、 circle、 square 來分別使用實心小黑圓圈（默認），空心小黑圓圈，實心小黑方塊來標記列表項目。
定義列表
- 自定義列表不僅僅是一列項目，而是項目及其注釋的組合。
- 自定義列表以
<dl>標簽開始，每個自定義列表項以<dt>開始，每個自定義列表項的定義以<dd>開始。
<dl> //自定義列表
<dt>Coffee</dt> //列表項
<dd>- black hot drink</dd> //列表項的注釋
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
