019_html超链接
1. html使用超鏈接與網絡上的另一個文檔相連。
2. 幾乎可以在所有的網頁中找到超鏈接。點擊超鏈接可以從一張頁面跳轉到另一張頁面。
3. html超鏈接
3.1. 超鏈接可以是一個字, 一個詞, 或者一組詞, 也可以是一幅圖像, 您可以點擊這些內容來跳轉到新的文檔或者當前文檔中的某個部分。
3.2. 當您把鼠標指針移動到網頁中的某個超鏈接上時, 箭頭會變為一只小手。
3.3. 我們通過使用<a />標簽在html中創建超鏈接。
3.4. 有兩種使用<a />標簽的方式:
?3.4.1. 通過使用href屬性, 創建指向另一個文檔的超鏈接。
?3.4.2. 通過使用name屬性, 創建文檔內的書簽。
3.5. 可能的屬性
4. html超鏈接語法
4.1. 超鏈接的html代碼很簡單。它類似這樣:<a href="url">Link text</a>
4.2. href屬性規定超鏈接的目標。
4.3. 開始標簽和結束標簽之間的文字被作為超級鏈接來顯示。
4.4. 實例, 點擊這個超鏈接會把用戶帶到W3School的首頁:
<a href="http://www.w3school.com.cn/">Visit W3School</a>5. html超鏈接-target屬性
5.1. 使用target屬性, 你可以定義被鏈接的文檔在何處顯示。
5.2. 下面的這行會在新窗口打開文檔:
<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>6. html超鏈接-name屬性
6.1. name屬性規定錨(anchor)的名稱。
6.2. 您可以使用name屬性創建html頁面中的書簽。
6.3. 書簽不會以任何特殊方式顯示, 它對讀者是不可見的。
6.4. 當使用命名錨(named anchors)時, 我們可以創建直接跳至該命名錨(比如頁面中某個小節)的鏈接, 這樣使用者就無需不停地滾動頁面來尋找他們需要的信息了。
6.5. 命名錨的語法: <a name="label">錨(顯示在頁面上的文本)</a>
6.6. 您可以使用id屬性來替代name屬性, 命名錨同樣有效。
7. 錨的用法
7.1. 首先, 我們在html文檔中對錨進行命名(創建一個書簽):<a name="tips">基本的注意事項 - 有用的提示</a>
7.2. 然后, 我們在同一個文檔中創建指向該錨的鏈接:<a href="#tips">有用的提示</a>
7.3. 您也可以在其他頁面中創建指向該錨的鏈接:
<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>7.4.?命名錨經常用于在大型文檔開始位置上創建目錄。可以為每個章節賦予一個命名錨, 然后把鏈接到這些錨的鏈接放到文檔的上部。如果您經常訪問百度百科, 您會發現其中幾乎每個詞條都采用這樣的導航方式。 假如瀏覽器找不到已定義的命名錨, 那么就會定位到文檔的頂端。不會有錯誤發生。
8. 圖片超鏈接
8.1. 代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head><meta charset="utf-8" /><title>圖像超鏈接</title></head><body><a href="https://www.w3school.com.cn" target="_blank"><img src="w3school.png" alt="跳轉到w3school首頁" /></a></body> </html>9.?文檔內錨
9.1. 代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head><meta charset="utf-8" /><title>文檔內錨</title></head><body><a href="#grammar">html鏈接語法</a> <br /> <br /><a href="#attribute">html超鏈接-name屬性</a> <br /> <br /> <hr /><h1>超鏈接簡介</h1><h3>1. html使用超鏈接與網絡上的另一個文檔相連。</h3><h3>2. 幾乎可以在所有的網頁中找到超鏈接。點擊超鏈接可以從一張頁面跳轉到另一張頁面。</h3><br /><h1>html超鏈接</h1><h3>3.1. 超鏈接可以是一個字, 一個詞, 或者一組詞, 也可以是一幅圖像, 您可以點擊這些內容來跳轉到新的文檔或者當前文檔中的某個部分。</h3><h3>3.2. 當您把鼠標指針移動到網頁中的某個鏈接上時, 箭頭會變為一只小手。</h3><h3>3.3. 我們通過使用<a />標簽在html中創建鏈接。</h3><h3>3.4. 有兩種使用<a />標簽的方式:</h3><h5>3.4.1. 通過使用href屬性, 創建指向另一個文檔的鏈接。</h5><h5>3.4.2. 通過使用name屬性, 創建文檔內的書簽。</h5><br /><h1><a id="grammar">html鏈接語法</a></h1><h3>4.1. 鏈接的html代碼很簡單。它類似這樣:<a href="url">Link text</a></h3><h3>4.2. href屬性規定鏈接的目標。</h3><h3>4.3. 開始標簽和結束標簽之間的文字被作為超級鏈接來顯示。</h3><h3>4.4. 實例, 點擊這個超鏈接會把用戶帶到W3School的首頁:</h3><h5><a href="http://www.w3school.com.cn/">Visit W3School</a></h5><br /><h1><a id="attribute">html超鏈接-name屬性</a></h1><h3>6.1. name屬性規定錨(anchor)的名稱。</h3><h3>6.2. 您可以使用name屬性創建html頁面中的書簽。</h3><h3>6.3. 書簽不會以任何特殊方式顯示, 它對讀者是不可見的。</h3><h3>6.4. 當使用命名錨(named anchors)時, 我們可以創建直接跳至該命名錨(比如頁面中某個小節)的鏈接, 這樣使用者就無需不停地滾動頁面來尋找他們需要的信息了。</h3><h3>6.5. 命名錨的語法: >a name="label"<錨(顯示在頁面上的文本)>/a<</h3><h3>6.6. 您可以使用id屬性來替代name屬性, 命名錨同樣有效。</h3><br /><h1>錨的用法</h1><h3>7.1. 首先, 我們在html文檔中對錨進行命名(創建一個書簽):<a name="tips">基本的注意事項 - 有用的提示>/a></h3><h3>7.2. 然后, 我們在同一個文檔中創建指向該錨的鏈接:<a href="#tips">有用的提示</a></h3><h3>7.3. 您也可以在其他頁面中創建指向該錨的鏈接:</h3><h5><a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a></h5><h3>7.4. 命名錨經常用于在大型文檔開始位置上創建目錄。可以為每個章節賦予一個命名錨, 然后把鏈接到這些錨的鏈接放到文檔的上部。如果您經常訪問百度百科, 您會發現其中幾乎每個詞條都采用這樣的導航方式。 假如瀏覽器找不到已定義的命名錨, 那么就會定位到文檔的頂端。不會有錯誤發生。</h3><br /><h1>html超鏈接-target屬性</h1><h3>5.1. 使用Target屬性, 你可以定義被鏈接的文檔在何處顯示。</h3><h3>5.2. 下面的這行會在新窗口打開文檔:</h3><h5><a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a></h5><br /><br /></body> </html>10. 文檔外錨點
10.1. 代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head><meta charset="utf-8" /><title>文檔外錨</title></head><body><a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a></body> </html>總結
以上是生活随笔為你收集整理的019_html超链接的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 017_html图像
- 下一篇： 025_html表格