zoukankan      html  css  js  c++  java
  • HTML 链接

    HTML 超链接(链接)

    超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。

    当您把鼠标指针移动到网页中的某个链接上时,箭头会变为一只小手。

    我们通过使用 <a> 标签在 HTML 中创建链接。

    有两种使用 <a> 标签的方式:

    1. 通过使用 href 属性 - 创建指向另一个文档的链接
    2. 通过使用 name 属性 - 创建文档内的书签

      HTML 链接语法

      链接的 HTML 代码很简单。它类似这样:

      <a href="url">Link text</a>

      href 属性规定链接的目标。

      开始标签和结束标签之间的文字被作为超级链接来显示。

      实例

      <a href="http://www.w3school.com.cn/">Visit W3School</a>

      上面这行代码显示为:Visit W3School

      点击这个超链接会把用户带到 W3School 的首页。

      提示:"链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。

    HTML 链接 - target 属性

    使用 Target 属性,你可以定义被链接的文档在何处显示。

    下面的这行会在新窗口打开文档:

    <a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

    HTML 链接 - name 属性

    name 属性规定锚(anchor)的名称。

    您可以使用 name 属性创建 HTML 页面中的书签。

    书签不会以任何特殊方式显示,它对读者是不可见的。

    当使用命名锚(named anchors)时,我们可以创建直接跳至该命名锚(比如页面中某个小节)的链接,这样使用者就无需不停地滚动页面来寻找他们需要的信息了。

    命名锚的语法:

    <a name="label">锚(显示在页面上的文本)</a>

    提示:锚的名称可以是任何你喜欢的名字。

    提示:您可以使用 id 属性来替代 name 属性,命名锚同样有效。

    实例

    首先,我们在 HTML 文档中对锚进行命名(创建一个书签):

    <a name="tips">基本的注意事项 - 有用的提示</a>

    然后,我们在同一个文档中创建指向该锚的链接:

    <a href="#tips">有用的提示</a>

    您也可以在其他页面中创建指向该锚的链接:

    <a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>

    在上面的代码中,我们将 # 符号和锚名称添加到 URL 的末端,就可以直接链接到 tips 这个命名锚了。

     <p>
    这是邮件链接:
    <a href="mailto:someone@microsoft.com?subject=Hello%20again">发送邮件</a>
    </p>

    <p>
    <b>注意:</b>应该使用 %20 来替换单词之间的空格,这样浏览器就可以正确地显示文本了。
    </p>

     

     

  • 相关阅读:
    LeetCode "Palindrome Partition II"
    LeetCode "Longest Substring Without Repeating Characters"
    LeetCode "Wildcard Matching"
    LeetCode "Best Time to Buy and Sell Stock II"
    LeetCodeEPI "Best Time to Buy and Sell Stock"
    LeetCode "Substring with Concatenation of All Words"
    LeetCode "Word Break II"
    LeetCode "Word Break"
    Some thoughts..
    LeetCode "Longest Valid Parentheses"
  • 原文地址:https://www.cnblogs.com/james2015/p/4933080.html
Copyright © 2011-2022 走看看