06超链接 

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <!--解决乱码 ，告诉浏览器文档类型和编码
 5 http-equiv:描述当前网页内容类型
 6 context：使用的是html的文本
 7 charset：使用的编码是UTF-8,解码也使用UTF-8
 8 -->
 9 <meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
10 <title>Insert title here</title>
11 </head>
12 <body>
13 <!-- 
14     a标签：anchor锚
15           1.超链接 => 点击之后跳转页面
16               格式：协议名+资源
17                    http://www.baidu.com(常用)
18                    mailto:xx@beyondh.com 发送邮件
19                    thunder:迅雷下载
20                    QQ:
21           2.锚 => 在当前页面中跳转例如：回到顶部 ==>使用就是锚
22             1.做一个锚标记 ，使用a标签的name属性指定锚点名称. <a name="abc">这是顶部</a>
23             2.跳转到锚标记，使用a标签的href属性指定要跳转到的锚点.<a href="#abc" >回到顶部</a>
24     
25     a标签中的属性
26             href:跳转的资源名或锚点名称
27             name属性：定义锚点时，指定锚点名称
28             target属性：针对资源跳转时使用.
29                该属性不指定==>在当前页面打开
30              _blank：在空白页打开.
31              
32              
33  
34  -->
35     <a name="abc">这是顶部</a>
36     <a href="http://www.baidu.com">百度</a>
37     <a href="05图形标签.html" target="_blank">05图形标签</a>
38     <a href="mailto:xx@beyondh.com">联系我们</a>
39     <a href="thunder://DHJDJSA">点击下载</a>
40     <img src="Pic/haha (1).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
41     <img src="Pic/haha (2).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
42     <img src="Pic/haha (3).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
43     <img src="Pic/haha (4).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
44     <a name="middle"></a>
45     <img src="Pic/haha (5).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
46     <img src="Pic/haha (6).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
47     <img src="Pic/haha (7).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
48     <img src="Pic/haha (8).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
49     <img src="Pic/haha (9).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
50     <img src="Pic/haha (10).jpg" alt="这是大长腿！" title="这是大长腿~~" /><br>
51     <!-- #:表示当前页面中的锚 -->
52     <a href="#abc" >回到顶部</a><a href="#middle">回到中间</a>
53     
54     
55     
56 
57   
58 </body>
59 </html>

 

posted @ 2016-02-20 00:34  男儿当自强！  阅读(175)  评论(0)    收藏  举报