zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    取消select默认样式
    浏览器私有前缀
    兼容ie的background-size: cover;
    关于字体
    lorem 快速生成x个单词
    bash常见命令
    rgba透明的兼容处理
    JDK源码分析(10) CopyOnWriteArrayList
    JDK源码分析(9) LinkedHashMap
    JDK源码分析(8) StringBuffer & StringBuilder
  • 原文地址:https://www.cnblogs.com/Forever-IT/p/5202536.html
Copyright © 2011-2022 走看看