標籤：就會 lan java 訪問者 javascrip 關係 提示 瞭解 tar
一、使用<a>標籤，連結到另一個頁面1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>了不起的蓋茨比</title> 6 </head> 7 <body> 8 <ul> 9 <li><a href="#" title="前端開發面試心法">前端開發面試心法</a> </li>10 <li><a href="#" title="零基礎學習html">零基礎學習html</a></li>11 <li><a href="#" title="JavaScript全攻略">JavaScript全攻略</a></li>12 </ul>13 <p>1922年的春天，一個想要成名名叫尼克?卡拉威（托比?馬奎爾Tobey Maguire 飾）的作家，離開了美國中西部，來到了紐約。那是一個道德感漸失，爵士流行，走私為王，股票飛漲的時代。為了追尋他的美國夢，他搬入紐約附近一海灣居住。</p>14 <p>菲茨傑拉德，二十世紀美國文學巨擘之一，兼具作家和編劇雙重身份。他以詩人的敏感和戲劇家的想象為"爵士時代"吟唱華麗輓歌，其詩人和夢想家的氣質亦為那個奢靡年代的不二註解。</p>15 </body>16 </html>使用a標籤，連結到另一個頁面
使用<a>標籤可實現超連結，它在網頁製作中可以說是無處不在，只要有連結的地方，就會有這個標籤。
文法：<a href="目標網址" title="滑鼠滑過顯示的文本">連結顯示的文本</a>
例如：
<a href="http://www.imooc.com" title="點擊進入慕課網">click here!</a>
上面例子作用是單擊click here!文字，網頁連結到http://www.imooc.com這個網頁。
title屬性的作用，滑鼠滑過連結文字時會顯示這個屬性的常值內容。
這個屬性在實際網頁開發中作用很大，主要方便搜尋引擎瞭解連結地址的內容（語義化更友好）。
注意：還有一個有趣的現象不知道小夥伴們發現了沒有，只要為文本加入a標籤後，
文字的顏色就會自動變為藍色（被點擊過的文本顏色為紫色），顏色很難看吧，
不過沒有關係後面我們學習了css樣子就可以設定過來（a{color:#000})。
在編輯器中的第13行的“托比·馬奎爾Tobey Maguire”這幾個字做連結，
連結到的目標網址為“http://www.m1905.com/mdb/star/3316/”。
1、<a href="目標網址">連結顯示的文本</a>
2、不要忘記寫了"http://"
href：Hypertext Reference的縮寫。意思是超文本引用。
二、在建立瀏覽器視窗中開啟連結1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>了不起的蓋茨比</title> 6 </head> 7 <body> 8 <p>1922年的春天，一個想要成名名叫尼克?卡拉威（<a href="http://www.m1905.com/mdb/star/3316/">托比?馬奎爾Tobey Maguire </a>飾）的作家，離開了美國中西部，來到了紐約。那是一個道德感漸失，爵士流行，走私為王，股票飛漲的時代。為了追尋他的美國夢，他搬入紐約附近一海灣居住。</p> 9 <p>菲茨傑拉德，二十世紀美國文學巨擘之一，兼具作家和編劇雙重身份。他以詩人的敏感和戲劇家的想象為"爵士時代"吟唱華麗輓歌，其詩人和夢想家的氣質亦為那個奢靡年代的不二註解。</p>10 </body>11 </html>在建立瀏覽器視窗中開啟連結
<a>標籤在預設情況下，連結的網頁是在當前瀏覽器視窗中開啟，有時我們需要在新的瀏覽器視窗中開啟。
如下代碼：<a href="目標網址" target="_blank">click here!</a>
把編輯器中的第8行的超連結改為在新視窗中開啟。
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 5 <title>mailto</title> 6 </head> 7 <body> 8 <p>1922年的春天，一個想要成名名叫卡拉威（馬奎爾Tobey Maguire 飾）的作家，離開了美國中西部，來到了紐約。那是一個道德感漸失，爵士流行，走私為王，股票飛漲的時代。為了追尋他的美國夢，他搬入紐約附近一海灣居住。</p> 9 <p>菲茨傑拉德，二十世紀美國文學巨擘之一，兼具作家和編劇雙重身份。他以詩人的敏感和戲劇家的想象為"爵士時代"吟唱華麗輓歌，其詩人和夢想家的氣質亦為那個奢靡年代的不二註解。</p>10 對此影評有何感想，發送郵件給我11 </body>12 </html>使用mailto在網頁中連結Email地址
<a>標籤還有一個作用是可以連結Email地址，使用mailto能讓訪問者便捷向網站管理者寄送電子郵件。我們還可以利用mailto做許多其它事情。下面一一進行講解，請看詳細圖示：
注意：如果mailto後面同時有多個參數的話，第一個參數必須以“?”開頭，後面的參數每一個都以“&”分隔。
下面是一個完整的執行個體:
在瀏覽器中顯示的結果：
發送
點選連結會開啟電子郵件應用，並自動填寫收件者等設定好的資訊，如：
把編輯器中的第10行的“對此影評有何感想，發送郵件給我”加入連結，使其單擊後可以自動發送郵件，具體要求：
1、收送人郵箱地址：[email protected]。
2、郵件主題：觀了不起的蓋茨比有感。
3、郵件內容：你好，對此評論有些想法。
忘記了mailto寫法了？
<a href="mailto:[email protected]?subject=主題名稱&body=郵件內容">
Mailto後為收件者地址，cc後為抄送地址，bcc後為密件副本地址，subject後為郵件的主題，body後為郵件的內容，
四、認識<img>標籤，為網頁插入圖片1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>了不起的蓋茨比</title> 6 </head> 7 <body> 8 <p>1922年的春天，一個想要成名名叫尼克?卡拉威（<a href="http://www.m1905.com/mdb/star/3316/">托比?馬奎爾Tobey Maguire </a>飾）的作家，離開了美國中西部，來到了紐約。那是一個道德感漸失，爵士流行，走私為王，股票飛漲的時代。為了追尋他的美國夢，他搬入紐約附近一海灣居住。</p> 9 <p>菲茨傑拉德，二十世紀美國文學巨擘之一，兼具作家和編劇雙重身份。他以詩人的敏感和戲劇家的想象為"爵士時代"吟唱華麗輓歌，其詩人和夢想家的氣質亦為那個奢靡年代的不二註解。</p>10 <img src="http://img.mukewang.com/52da54ed0001ecfa04120172.jpg"> 11 </body>12 </html認識img標籤，為網頁插入圖片
在網頁的製作中為使網頁炫麗美觀，肯定是缺少不了圖片，可以使用<img>標籤來插入圖片。
文法：
<img src="圖片地址" alt="下載失敗時的替換文本" title = "提示文本">
舉例：
<img src = "myimage.gif" alt = "My Image" title = "My Image" />
講解：
1、src：標識映像的位置；
2、alt：指定映像的描述性文本，當映像不可見時（下載不成功時），可看到該屬性指定的文本；
3、title：提供在映像可見時對映像的描述(滑鼠滑過圖片時顯示的文本)；
4、映像可以是GIF，PNG，JPEG格式的影像檔。
試一試為圖片加入滑鼠滑過時的提示文本
在編輯器中的第10行補充下面代碼：
title="電影介紹"
從零開始學習html（四）認識標籤(第三部分)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
