HTML——4（超链接）

最新推荐文章于 2021-05-07 08:04:25 发布
最新推荐文章于 2021-05-07 08:04:25 发布
阅读量741 收藏
点赞数
分类专栏： HTML/JavaScript/CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Decorator2015/article/details/51262468
版权

超链接

1.URI的类型

1.1URI通常包括下列几个部分。

通讯协议：//服务器名称[:通讯端口编号]/文件夹[/文件夹2…]/文件名称
例如：http://www.lucky.com.tw/Books/index.html

其中：
服务器名称[:通讯端口编号]：服务器名称是提供服务的主机名，而冒号后的通信端口用来指定要开启哪个通信端口，省略不写的话，表示为默认值80。由于主机可能同时担任不同的服务器，为了便于区分，每种服务器会对各自对应一个通信端口，例如HTTP 的通信端口编号为80。

文件夹：这是存放文件的地方。
文件名称：这是文件的完整名称，包括主文档名与扩展名。

1.2绝对URI

例如 ：http://www.lucky.com.tw/Books/index.html

1.3相对URI

(1)文件相对URI
例如： ../../Contact/email.html
(2)服务器相对URI
例如：/Contact/email.html

2.标记超链接——<a>元素

  <body bgcolor="#ffffdd" alink="green">
　　<ul type="circle">
      <li><a href="africa.html">非洲动物区</a></li> 
      <li><a href="asia.html">亚洲动物区</a></li>
      <li><a href="Hot\kiwi.html">奇异鸟</a></li>
      <li><a href="Hot\koala.html">无尾熊</a></li>
      <li><a href="Hot\penguin.html">企鹅</a></li>
     </ul>
     热门好站推荐：<a href="http://www.zoo.gov.tw" title="Taipei Zoo">木栅动物园</a>
     <br> <br>
     <a href="mailto:jeanchen@mail.lucky.net.tw"> 欢迎写信给我们</a>
  </body>

3.指定相对URI的路径信息——<base>元素

<!doctype html>
<html>
   <head>
     <meta charset="utf-8">
     <title>示范相对地址</title>
     <base href="http://www.lucky.com/product/default.html">
   </head>
   <body>
     <a href="../books/css.html">CSS网页程序设计</a>
   </body>
</html>

4.指定文件之间的关联——<link>元素

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>指定文件的引用关联</title>
    <link type="text/html" rel="help" href="help.html">
    <link rel="top" href="http://www.lucky.com.tw/">
    <link rev="previous" href="backpage.html">
    <link type="text/css" rel="stylesheet" href="h1.css">
  </head>   
  <body>
  </body>
</html>

5.建立书签

这里写图片描述

 <body>
    <p>您可知道，在这片名为福尔摩莎的宝岛上，不仅孕育了许多特有的鸟种，更是许多候鸟过冬栖息的庇护所，例如黑面琵鹭、小青足鵴、大白鹭、鹰斑鵴、苍鹭、戴胜、灰鹡鸰、高翘行、小环颈行鸟、燕行鸟、反嘴行鸟、中白鹭、金斑行鸟、赤腹鹰、中白鹭、八色鸟、花嘴鸭等，只要您肯用心留意，就可以看到这些美丽的天使。在这里，我们为您介绍的候鸟有：</p>
    <ul>
      <li><a href="#黑面琵鹭">黑面琵鹭</a></li>
      <li><a href="#赤腹鹰">赤腹鹰</a></li>
      <li><a href="#八色鸟">八色鸟</a></li> 
    </ul>
    <hr>
    <dl>
      <dt><b><i><a name="黑面琵鹭">黑面琵鹭</a></i></b></dt>
      <dd>黑面琵鹭最早的栖息地是韩国及中国的北方沿海，但近年来它们觅着了
      一个新的栖息地，那就是宝岛台湾的曾文溪口沼泽地。</dd> 
      <dt><b><i><a name="赤腹鹰">赤腹鹰</a></i> </b></dt>
        <dd>赤腹鹰的栖息地在垦丁、恒春一带，只要一到每年的八、九月，赤腹鹰
        就会成群结队的到台湾过冬，爱鹰的人士可千万不能错过。</dd>
      <dt><b><i><a name="八色鸟">八色鸟</a></i></b></dt>
      <dd>八色鸟在每年的夏天会从东南亚地区飞到台湾繁殖下一代，由于羽色艳
      丽(八种色彩)，可以说是山林中的漂亮宝贝。</dd>
    </dl>
  </body>
Decorator2015
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
web前端学习（三）——HTML 超链接、列表
m0_55637498的博客
12-08 2532
四、超链接（重要） 超链接以<a>开始，以</a>结束 超链接有一个target属性： 可取值： _blank：新窗口 _self：当前窗口（默认） _top：顶级窗口 _parent：父窗口 特点： 1、超链接文字的下面都会出现一条水平线 2、当鼠标移动到超链接文字上面时，会变成小手样式 3、点击超链接之后能跳转到相应网址页面 ...
动物相册——HTML效果
01-21
"动物相册——HTML效果"是一个关于网页设计的项目，主要使用HTML、CSS3和可能的一些JavaScript技术来创建一个展示动物图片的互动相册。在这个项目中，开发者可能利用了HTML的基本结构元素来构建页面框架，如`...
logback 配置（显示类名、方法名、代码行号问题）
热门推荐
蓝天
10-13 2万+
概述 logback日志配置了输出格式，但是日志输出中为“?.?(?)”，这位调试问题造成了很大的影响。 配置 光有以下配置，还不行, 还需要添加“AsyncAppender”。 &lt;?xml version="1.0" encoding="UTF-8" ?&gt; &lt;configuration&gt; &lt;property name="rootPath" value="/.
HTML中的超链接
IT可乐
03-25 369
&#13; 超链接：也叫URL（Uniform Resource Locator），就是统一资源定位器。一般效果是我们点击网页上某个地方，网页会自动跳转到另外一个地方。&#13; 一般链接遵循以下要求：scheme://host.domain:port/path/filename&#13; 比如W3C的网站地址为：http://www.w3school.com.cn/htm...
HBuilder 链接图文详解
anya1618的博客
05-13 6730
第二步 第三步 第四步 下面连接mangodb就可以了 希望能够帮助到大家 转载于:https://www.cnblogs.com/liurenli/p/10857492.html
html <a>标签四种常用超链接
weixin_42630877的博客
07-16 5986
&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;a标签&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;!--在本窗口打开链接--&gt; &
HTML——＞超链接
qq_55016379的博客
05-07 255
超链接 超链接简介 定义：超链接，英文名为hyperlink。每一个网站由非常多的网页组成，而网页之间通常都是通过超链接来相互关联的。超链接给我们提供了独立页面之间方便跳转的方式 a标签 在HTML中，我们可以使用a标签来实现超链接 语法结构： <a herf="链接地址">文本或图片</a> herf表示想要跳转的那个网页的路径，可以是相对路径，也可以是绝对路径 文本超链接：将文本设为超链接 图片超链接：将图片设为超链接 代码实例 <!DOCTYPE html>
HTML学习笔记——建立超链接
菜鸟的编程之路
09-01 919
6.1 超链接的基本知识 （1） 绝对路径 绝对路径是包括服务器在内的完全路径。绝对路径不管源文件在什么位置都可以非常精确的找到，除非是目标文档的位置发生变化，否则链接不会失效。 采用绝对地址的好处是，它同链接的源端点无关，只要网站的地址不变，无论文档在站点中如何移动，都可以正常实现跳转而不会发生错误。另外，如果希望链接同站点上的其他内容，就必须使用绝对地址。 采用绝对路径的缺点在于这种方式的链接...
HTML（四）——建立超链接
程序员的时光
03-03 1895
1.文字超链接 文字链接是最简单的一种，我们在html文件中，用&lt;a&gt;&lt;/a&gt;标签就可以实现； &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Insert title here&lt;/title&g
HTML基本常识——超链接
qq_37196494的博客
07-12 375
<a href="..." target="...."> href：属性必须有，设置目标页面的地址，它的值为URL。可用“#”代替URL target：设置链接被单击后打开窗口的方式 1._blank：指定的链接将会在新浏览器窗口打开 2._parent：指定的链接将会加载到父框架页或窗口中，如果包含链接的框架没有嵌套，链接加载到整个浏览器窗口中 ...
HTML——009超链接/热链接的使用
sk_girl的博客
04-15 208
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>超链接 热链接</title> </head> <body> <!-- 超链接的特点： 有下划线 鼠标停留在超链接上面显示小手形状 点击超链接之后还能跳转页面 --> <a href="http://www.j
HTML基础知识——设置超链接的样式简单实例
09-28
在HTML中，超链接（Hyperlink）是页面间导航的关键元素，通过`<a>`标签来实现。本篇将详细介绍如何设置HTML超链接的样式，并提供一个简单的实例。 超链接的四个不同状态： 1. `a:link`：表示未访问的链接状态。当...
狂神说——HTML完整教学通俗易懂
05-20
4. 块级元素与内联元素：HTML元素分为块级元素（如、）和内联元素（如、)。块级元素占据一整行，内联元素则只占据自身内容所需的空间，它们可以组合使用以创建复杂的布局。 5. 表格（）：HTML中的标签用于创建表格...
HTML4PawsCitizens
03-06
HTML4PawsCitizens是一个可能的在线学习项目或者课程，主要针对的是初学者，特别是对网页设计感兴趣的“公民”——这可能意味着它面向广大公众，不分年龄和专业背景。这个项目的核心是教授HTML（HyperText Markup ...
JavaScript——2（对象）
Decorator2015的博客
05-13 8050
1，对象（Object）或实例（instance）：在JavaScript中，对象则是数据与程序代码的组合，它可以是整个应用程序或整个应用程序的一部分。 2，属性（property）或字段（filed）：是用来描述对象的特质。 3，方法（method）：是用来执行对象的动作。 4，事件（event）：是在某些情况下发出特定信号警告。 5，类（class）：是对象的分类，就像对
HTML——7（窗体与后台处理）
Decorator2015的博客
05-03 6860
窗体与后台处理1.建立窗体——<form>,<input>元素窗体（form）可以提供输入接口，让用户输入数据，然后将数据传回web服务器，以做进一步的处理。<form method="post" action="handle.php"> <form method="post" action="mailto:jeanchen@mail.lucky.com.tw"><input>元素用来在窗体中插入输
CSS——（CSS样式规则，CSS样式表单，选择器，常用的CSS属性）
Decorator2015的博客
05-13 4619
CSS（Cascading Style Sheets，层叠样式表单）是由W3C所提出，主要的用途是控制网页的外观，也就是定义网页的编排，显示，格式化及特殊效果，有部分功能与HTML重叠。1.CSS样式规则与选择器CSS样式表单是由一条一条的样式规则（style rule）所组成，而样式规则包含选择器（selector）与声明（declaration）两个部分：选择器{属性：值[；属性：值[; …]]
HTML——6（表格）
Decorator2015的博客
05-03 4556
表格1.建立表格——<table>,<tr>,<td>,<th>元素<body> <table border="1"> <tr> <th>人物素描</th> <th>角色</th> <th>介绍</th> </tr> <tr> <td><img src="piece1.jpg" width="
JavaScript——1（基本语法，类型，变量与运算符，控制流程，函数）
Decorator2015的博客
05-12 1058
一.JavaScript的基本语法1，JavaScript是一种应用广泛的浏览器端Scripts。 2，JavaScript并没有规定每条程序语句的结尾一定要加上分号(;)。 3，函数名称的开头建议以动词表示，例如initializeComponent,closeDialog等。 4，事件处理程序名称的结尾建议以EventHandler表示， 例如 mouseEventHandler。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值