html之超链接

于 2015-10-11 09:04:08 发布
阅读量661 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 代码杂货铺
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Prince140678/article/details/49045541
本文介绍了HTML中超链接的不同类型及使用方法，并展示了如何利用HTML创建基本表格结构。此外，还探讨了一些实用技巧，如使用定位标记实现页面内的跳转等。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

<html>
    <head>
        <meta charset="utf-8">
        <title>demo_4--超链接</title>
    </head>
    <body>
        <!--上网时，不要乱点，否则可能会打开不想要的网页，可以把鼠标放在超链接上，看看是不是可靠网站-->
        <a name="top">顶部位置</a><!--对应着下面的“回到顶部”-->
        <br />
        <a href="www.baidu.com">百度一下</a><!--打不开，会链接到本地-->
        <br />
        <a href="http://www.sina.com" target="_blank">新浪官网</a><!--超链接为内联元素-->
        <br />
        <a href="http://www.qq.com"><img src="images/加速小球.png" /></a><!--图片超链接-->
        <br />
        <a href="http://www.baidu.com">百度一下,你就知道</a><!--在火狐中，不加http和加http的超链接颜色不同-->
        <br />
        <!--mailto:+"邮箱地址"+"?"+"参数=参数值"+"&"+"参数=参数值"+.....-->
        <!--目前这个功能不能用，不知为啥？-->
        <a href="mailto:1072805311@qq.com?subject=Summary&cc=thomas@hotmail.com">联系我们</a><!--不能使用&&要用&-->    
        <br />
        <a href="thunder://www.baidu.com">下载地址</a>
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <br /><!--无效-->
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<br />--><!--无效,在表格与表格之间会有换行-->
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr color="#0000ff"/>
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr color="#00ff00" />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <hr color="#ff0000" />
        <table border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>单元格一</td><!--在sublime中创建多行的快捷方式，例如：td*2 按tab键-->
                <td>单元格二</td>
            </tr>
            <tr>
                <td>单元格三</td>
                <td>单元格四</td>
            </tr>
            <!--<hr color="#0000ff" />-->
            <!--hr放在这里显示的效果是在“百度一下，你就知道”下面显示，而不是在表格的某一行下面显示-->

        </table>
        <a href="#">回到顶部</a><!--这是定位标记，也叫锚。忽然发现，里面写个空链接也能回到顶部-->
        <a href="#top">再次回到顶部</a>
    </body>
</html>
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值