首页 > 软件开发 > HTML >

详解HTML超链接元素

来源:互联网 2023-03-16 19:13:01 174

详解HTML超链接元素kdN办公区 - 实用经验教程分享!

方法/步骤

  • 1

    在浏览网页中,单击一个链接就会打开一个新的网页,这种链接网页的功能称为超链接。在网页中添加超链接功能可以使用a标签,a标签有两个比较重要的属性,一个属性是href,一个属性是target。kdN办公区 - 实用经验教程分享!

    href属性指定要打开的网页路径,网页路径可以是相对路径,也可以是绝对路径。相对路径是指要打开的网页路径相对于当前网页文件所在的目录来指向的路径,绝对路径是指要打开的网页文件所在的全部路径,绝对路径一般以http开头,后面紧跟网页文件所在网站的路径。kdN办公区 - 实用经验教程分享!

    target属性用于指定打开新网页的方式。在当前网页打开一个新的网页,有以下几种方式。一是浏览器开启一个新的窗口用于打开新的网页,target属性值设置为“_blank”;二是浏览器在当前窗口打开新的网页,当前网页的内容被新网页的内容覆盖掉,target属性值设置为“_self”;三是在框架窗口中(关于框架窗口后面会讨论),将target属性值设置为“_parent”,可以让新的网页充满整个浏览器窗口,框架窗口中的网页内容被覆盖掉,不过在框架窗口中,不建议使用属性值“_parent”,因为这样就破坏了框架窗口原来的结构;四是在多层框架窗口中,将target属性值设置为“_top”,可以让新的网页充满整个浏览器窗口,也就是在多层框架中的顶层框架打开新的网页,如果是单层框架,其作用和“_parent”一致;五是在框架窗口中在指定的窗口打开新的网页。例如,框架窗口有A、B、C三个网页,A网页是顶部导航窗口,B 网页是左侧功能菜单窗口,C网页是右侧内容显示窗口,如果希望用户单击B网页的功能菜单时,希望新的网页在C网页窗口中打开,就可以将target属性值设置为C网页的名称。kdN办公区 - 实用经验教程分享!

    表格 1 target属性值kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 2

    例1:在A网页中打开B网页,打开方式为在新窗口中打开被链接网页。kdN办公区 - 实用经验教程分享!

    A网页文档(文件名称为a.html)kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 3

    B网页文档(文件名称为b.html)kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 3此文章未经许可获取自百度经验
  • 4

    下图是浏览器显示效果,从浏览器显示效果可以看出,在A网页单击“连接到B网页”,浏览器在新窗口打开B网页。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 5

    例2:在A网页中打开B网页,打开方式为在当前窗口中打开被链接网页。修改例1中A网页a标签的target属性值为“_self”。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 6

    下图是浏览器显示效果,从浏览器显示效果可以看出,在A网页单击“链接到B网页”,浏览器在当前窗口打开B网页。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 7

    例3:在A网页中打开图片,打开方式为在新窗口中打开图片。修改例1中A网页a标签的href属性值。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 8

    下图是浏览器显示效果,从浏览器显示效果可以看出,在A网页单击“查看图片”,浏览器在新的窗口打开图片文件。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 9

    例4:在A网页元素中设置书签,应用a标签定位到设置书签的元素。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 10

    下图是浏览器显示效果。网页书签是指在网页内进行元素的定位,被定位的元素称为书签,书签也使用a标签。设置书签的方法是在需要定位的网页元素前添加a标签,并设置a标签的name属性。name属性是网页元素的通用属性,用于标识网页元素,是网页元素在网页中的唯一名称。HTML4.0后又定义了属性id,属性id和name具有相同的作用,为了能够和以前的版本兼容保留了 name 属性,同时也可以使用 id 属性。在定位网页内元素链接a标签的href属性中设置需要定位元素的名称,在定位元素名称前加“#”。例如,待定位a标签的name属性为“article1”,链接a标签的href属性设置为“#article1”。kdN办公区 - 实用经验教程分享!

    详解HTML超链接元素kdN办公区 - 实用经验教程分享!

  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!kdN办公区 - 实用经验教程分享!


    标签: HTML

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码