【HTML进击】超链接篇

暑假ing，感觉自己得自学点东西。。。
于是就自己学一下HTML吧。hahahhah

建立超链接

超链接的两个路径简单了解
1，绝对路径：包括服务器在内的完全路径。
好处是它与链接的源端点无关。只要网址不变，无论文档在站点中如何移动，都可以实现正常的跳转而不会发生错误。另外，如果希望链接同站点上的其他内容，就必须使用绝对路径。
缺点是这种方式的链接不利于测试。
2，相对路径
可以表述源端点同目标端点之间的相互位置，它同源端点的位置密切相关。
好处在于如果站点的结构和文档的位置不变，那么链接就不会出错。
内部链接

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>内部链接</title>
</head>
<body>
    脑筋急转弯
    <p>1,<a href="1.html" target="_parent">先天是父母所遗传的体质，那后天呢？
    </a>
    </p>
</body>
</html>

下面为1.html内容

<html>
<head>
    <title>脑筋急转弯第一题答案</title>
</head>
<body>
    <meta charset="utf-8">
    <p>
        1，答案：后天是明天的明天
    </p>

</body>
</html>

这里写图片描述

点击跳转后就是

内部链接的语法：<a href="链接地址">链接的目标窗口语法：<a href="连接目标" target="目标窗口打开方式">
target 参数的取值有4种
-self 在当前页面中打开链接
-blank 在全新的空白窗口中打开
-top 在顶层框架中打开链接
-parent 在当前框架的上一层打开链接

锚点链接
网站中经常有那种长篇的，页面过长的网页，访问者需要不停的拖动滚动条来浏览。。为了方便用户的浏览，锚点链接闪亮登场！

语法：<a name="锚点名称"></a>
一个网页里可以有无数个锚点，但是！不可以有相同名称的两个锚点。

//代码，建立锚点
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>
        创建锚点
    </title>
</head>
<body>
    <table width="500" border="0" align="center" cellpadding="5" cellspacing="1">
        <tr>
            <td><a href="#1">商品名称</a></td>
            <td><a href="#2">产品特点</a></td>
            <td><a href="#3">产品规格</a></td>
        </tr>

        <tr>
            <td colspan="3">&nbsp;</td>
        </tr>

        <tr>
            <td colspan="3">&nbsp;</td>
        </tr>

        <tr>

            <td colspan="3">

        <p>
            <a name="1"></a>商品名称：
        </p>

        <p>彩音盒</p>

        <p>
            <a name="2"></a>产品特点：
        </p>
        <p>65536色全彩olED显示，支持MP3，WMA等音乐模式；独创MTV电影功能；<br>
        JPEG图片浏览功能；</p>

        <P>
            <a name="3"></a>产品规格：
        </P>
        <p>
            显示屏 96*64 OLED全彩屏显示<br>
            容量 128MB/256MB/512MB/1GB（内置）<br>
            电池 3.7锂聚合物电池<br>
            录音 优质录音MAV格式 长时录音ACT格式<br>
            所支持的操作系统 windows 98SE/2000/xp/MAC  os9.x以上系统<br>
        </p>

</td>
</tr>
    </table>

</body>
</html>

这里写图片描述
点击即可马上跳到对应内容。

链家到其他页面中的锚点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>
        链接到其他页面中的锚点
    </title>
</head>
<body>
    <table width="500" border="0" align="center" cellpadding="10" cellspacing="0">
<tr>
    <td colspan="3"> MP3是一种大众价位的集MTV播放与图片浏览于一身的全彩mp3播放器外观小巧精致，时尚高档。</td>
</tr>

<td><a href="建立锚点.html#1">商品名称</a> </td>
<td><a href="建立锚点.html#2">产品特点</a></td>
<td><a href="建立锚点.html#3">产品规格</a> </td>
</tr>
</table>

</body>
</html>

这里写图片描述
点击页面就可以跳回上面建立锚点的网页。

【HTML进击】超链接篇

猜你喜欢