随笔记录方便自己和同路人查阅。

#------------------------------------------------我是可耻的分割线-------------------------------------------

  如何做链接?
  做链接也是通过元素(element)实现的。 做链接只需一个元素和一个属性就行了。下面是一个例子,它是一个指向 chinahtml.com 的链接:

  例1:

  <a href="http://url.cn/OHnOmN/">这是一个指向 url.cn/OHnOmN的链接</a>

  该例在浏览器中将显示如下:

  这是一个指向 url.cn/OHnOmN 的链接

  元素 a 代表“链接(anchor)”;属性 href 代表“超文本引用(hypertext reference)”,它用于指定链接指向何处——通常是一个因特网地址或者一个文件名。

  在上例中,属性 href 的值为“http://url.cn/OHnOmN”,这是url.cn/OHnOmN 网站的完整地址,也被称作URL(统一资源定位符)。注意,在URL 里必须包含“http://” 。 “这是一个指向chinahtml.com 的链接”是这个链接在浏览器中显示出来的文本。记得在元素结尾处写上 </。

  如何在同一网站的网页之间添加相互链接?

  如果你要在同一网站的不同网页间做链接,那就不必拼写出网页的完整 URL 。举个例子,假如你有两个网页(比如说 page1.htm 和 page2.htm ),而且它们被存放在同一个文件夹中,那么你在做链接的时候,只要写出文件名就行了。这样,page1.htm 到 page2.htm 的链接将。如下所示:

  例2:

  <a href="page2.htm">点击这里转到第2页</a>

  如果 page2.htm 被放在下一级文件夹中(比如“subfolder”),那么链接将是这样:

  例3 3:

  <a href="subfolder/page2.htm">点击这里转到第2页</a>

  反过来,从 page2.htm(在下级文件夹中)到 page1.htm 的链接将是这样:

  例4:

  <a href="../page1.htm">转到第1页</a>

  “../”代表当前位置(即该链接所在文件所处的文件夹)的上一级文件夹。同理,当前位置的上上级文件夹可用“../../”表示。明白其中的规则了吗?当然,如果给出完整 URL 也行。

  如果要在一个网页内做链接怎么办呢?

  你也可以在一个网页的内部做链接——比如在网页开始处提供一个目录,在其中列出指向下面各章的链接。这可以通过使用 id 属性和“#”符号来实现。用 id 属性标出要被指向的元素。例如:

  <h1 id="heading1">标题1</h1>

  然后通过在链接中利用“#”来指向那个元素。 “#”后面必须紧跟着一个 id 属性的值,表明链接指向该 id 属性被定义的地方。例如:

  <a href="#heading1">转到标题1</a>

  来看一个例子就明白了:

  例5:

<html>
  <head>
  </head>
  <body>
    <p><a href="#heading1">转到标题1</a></p>
    <p><a href="#heading2">转到标题2</a></p>
    <h1 id="heading1">标题1</h1>
    <p> 一 些 文 字 。。。。 </p>
    <h1 id="heading2">标题2</h1>
    <p> 一 些 文 字 。。。。 </p>
  </body>
</html>

  该例在浏览器中将显示如下(你可以试试看点击这两个链接):

  除了网页,链接还能指向什么?

  你还可以为 e-mail 地址做链接,方法跟为网页做链接差不多:

  例6:

  <a href="mailto:nobody@chinahtml.com">给 nobody@chinahtml.com 发电子邮件</a>

  该例在浏览器中将显示如下:

  与指向网页的链接的唯一区别在于:指向 e-mail 地址的链接必须以 mailto: 开头,然后紧接着写 e-mail 地址。当点击这个链接的时候,缺省的 e-mail 程序将新建一封邮件,其中的收件人地址为链接中指定的 e-mail 地址。注意:这一功能仅当你的计算机安装了 e-mail 程序后才起作用。试试看吧!

  有其他我需要知道的属性吗?

  创建链接总要用到 href 属性。另外,你也可以在链接上使用 title 属性:

  例7:

  <a href="https://www.cnblogs.com/lirongyang/" title="上博乐园学习 HTML">博乐园</a>

  该例在浏览器中将显示如下:

#------------------------------------------------我是可耻的分割线-------------------------------------------

  title 属性用于为该链接输入一个简短描述。当你把鼠标光标停留在该链接上(别点击它)时 , 提示文字“上博乐园学习 HTML”便会出现。

HTML学习笔记6----链接的更多相关文章

  1. muduo网络库学习笔记(五) 链接器Connector与监听器Acceptor

    目录 muduo网络库学习笔记(五) 链接器Connector与监听器Acceptor Connector 系统函数connect 处理非阻塞connect的步骤: Connetor时序图 Accep ...

  2. nodejs学习笔记二——链接mongodb

    a.安装mongoose库用来链接mongodb数据库 安装mongodb数据库参考mongodb安装 前言(怨言) 本来是想安装mongodb库来链接mongodb的,命令行到nodejs工程目录: ...

  3. 3.3html学习笔记之链接

    iframe 元素会创建包含另外一个文档的内联框架 <iframe src=""/> 跳转链接 <a href="#here" target= ...

  4. Python学习笔记9-Python 链接MySql数据库

    Python 链接MySql数据库,方法很简单: 首先需要先 安装一个MySql链接插件:MySQL-python-1.2.3.win-amd64-py2.7.exe 下载地址:http://dev. ...

  5. JZ2440学习笔记之链接文件lds

    如果在Linux环境下用arm-linux-gcc来编译arm程序,需要编写链接文件lds: 1. 运行地址=链接地址,表示代码在SDRAM中执行的地址,如果程序中有对某部分代码执行过搬运,需要在ld ...

  6. Linux运维学习笔记-软硬链接知识总结

    文件链接   硬链接,通过索引节点来进行链接 硬链接原理图 硬链接的创建: 直接执行命令“ln 源文件 硬链接文件”,即可完成创建硬链接. 硬链接知识小结: 1.具有相同Inode节点号的多个文件是互 ...

  7. Linux学习笔记 -- 硬链接与软连接(转)

    原文地址: http://www.cnblogs.com/itech/archive/2009/04/10/1433052.html Linux链接概念 Linux链接分两种,一种被称为硬链接(Har ...

  8. HTML学习笔记——锚链接、pre标签、实体

    1>锚链接 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  9. EF学习笔记(八):更新关联数据

    学习笔记主目录链接:ASP.NET MVC5 及 EF6 学习笔记 - (目录整理) 上一篇链接:EF学习笔记(七):读取关联数据 本篇原文链接:Updating Related Data 本篇主要考 ...

  10. ‎Cocos2d-x 学习笔记(19) Control Invocation

    [Cocos2d-x 学习笔记 目录链接] 1. 简介 control为其子类提供了touch回调函数,当子类触发EventType相关事件时,会调用相关的回调函数. control对象接收到的事件类 ...

随机推荐

  1. fabric学习笔记9

    fabric学习笔记9 20201303张奕博 2023.1.20 Python Web3 与智能合约的交互 开发合约,或者开源合约,都会有一份该合约的ABI JSON文件 ABI文件包括了智能合约的 ...

  2. 代码随想录训练营day 4|链表基础理论,移除链表元素,设计链表,反转链表

    链表理论基础 链表是一种由指针串联在一起的线性结构,每一个节点都由一个数据域和一个指针域组成. 链表的类型有:单链表.双链表.循环链表. 链表的存储方式:在内存中不连续分布. 链表的定义很多人因为不重 ...

  3. Docker 安全加固

    一.docker安全加固 1.利用LXCFS增强docker容器隔离性和资源可见性 (proc容器与宿主机之间是共享的 没有进行隔离) 此rpm包在真机桌面q目录中  需先传到虚拟机/root/下 在 ...

  4. JVM相关总结

    https://www.cnblogs.com/jiangym/p/15885161.html JVM内存模型(JMM) 根据代码画出下面的JVM内存模型 public class Math { pu ...

  5. 记录一次阿里云ECS搭建代理服务器的过程

    [参考资料](Tinyproxy安装与配置(ip代理) - 林先生 (downdawn.com)) 1.一键安装脚本 vim proxy.sh #! /bin/bash # 配置文件 CONFIG_F ...

  6. jmeter组件

    1.进程:一个正在执行的程序就对应一个进程 线程:进程中的执行线索(一个进程有多个执行线索) 线程组:按照线程性质对线程进行分组 2.并发执行:多个线程同时执行 特点:执行结束的顺序和线程的启动顺序不 ...

  7. CentOS 7关闭防火墙 SElinux 配ip

    屏蔽出站 iptables -t filter -A OUTPUT --dst 192.168.0.191/32 -j DROP iptables -t filter -A OUTPUT --dst ...

  8. 「SOL」网络流flow (模拟赛)

    题面 给定一张分层有向图,有 \(n\) 层,每层有 \(m\) 个点.只有从第 \(i\) 层的点连向第 \(i + 1\) 层的点的连边. 记 \(A(i,j)\) 表示从第 \(i\) 层的某些 ...

  9. Spring Boot 开启后缀匹配模式

    项目原有 Java 配置为继承 WebMvcConfigurationSupport, 而WebMvcConfigurationSupport#requestMappingHandlerMapping ...

  10. CCF 201812-2 小明放学

    #include <iostream> #include <bits/stdc++.h> #include <string> using namespace std ...