HTML超链接和路径

Love The Way You Lie 2021-09-29 03:44 397阅读 0赞

**html超链接和路径**

**学习要点：**

**    1.超链接的属性**

**    2.相对与绝对路径**

**    3.锚点设置****                         **

**一．超链接的属性**

**    <a></a>元素属于文本超链接元素，有一些私有属性或者叫局部属性。那么，相对应的还有通用属**

**性或叫做全局属性。这方面的知识，后面会详细探讨。**

** **

**        属性名称                                 说明**

** **

**          href        指定<a>元素所指资源的URL**

** **

**        hreflang      指向的链接资源所使用的语言**

** **

**          media       说明所链接资源用于哪种设备**

** **

**           rel        说明文档与所链接资源的关系类型**

** **

**         target       指定用以打开所链接资源的浏览环境**

** **

**          type        说明所链接资源的MIME类型（比如text/html）**

** **

**    在这几个属性当中，只有href和target一般比较常用，而href是必须要用的。其**

**他几个属性，在<a>元素使用较少，将在CSS章节再探讨。**

** **

**    1.href属性**

**    <a href="http://www.baidu.com">百度</a>**

**    解释：href是必须属性，否则<a>元素就变成空元素了。如果属性值是http://开头**

**的URL，意味着点击跳转到指定的外部网站。**

** **

**    2.target属性**

**    <a href="http://www.baidu.com target="\_blank">百度</a>**

**    解释：target属性告诉浏览器希望将所链接的资源显示在哪里。**

** **

**        属性名称                                 说明**

** **

**         \_blank       在新窗口或标签页中打开文档**

** **

**        \_parent       在父窗框组（frameset）中打开文档**

** **

**         \_self        在当前窗口打开文档（默认）**

** **

**          \_top        在顶层窗口打开文档**

** **

**    这四种最常用的是\_blank，新建一个窗口。而\_self是默认，当前窗口打开。\_parent**

**和\_top是基于框架页面的，分别表示在父窗口打开和在整个窗口打开。而HTML5中，框架**

**基本被废弃，只能使用<iframe>元素，且以后大量结合JavaScript和PHP等语言配合，**

**框架用的就很少了。**

**　　3.rel   
　　　　rel="nofollow"告诉搜索引擎不必跟踪**

** **

**二．相对与绝对路径**

**    所谓相对路径，就是相对于链接页面而言的另一个页面的路径。而绝对路径，就是直接**

**从file:///磁盘符开始的完整路径。我们在同一个目录下做上两个页面，其中一个页面链**

**接到另一个页面。**

** **

**    1.绝对路径**

**    <a href="file:///D:/备 /HTML5第一季/code/index2.html">index2</a>**

**    解释：首先是file:///开头，然后是磁盘符，然后是一个个的目录层次，找到相应文**

**件。这种方式最致命的问题是，当整个目录转移到另外的盘符或其他电脑时，目录结构一旦**

**出现任何变化，链接当即失效。**

** **

**    2.相对路径**

**    <a href="index2.html">index2</a>**

** **

**    解释：相对路径的条件是必须文件都在一个磁盘或目录下，如果是在同一个目录下，直**

**接属性值就是被链接的文件名.后缀名。如果在同一个主目录下，有多个子目录层次，那就**

**需要使用目录结构语法。**

** **

**    3.目录语法**

**    同一个目录：index2.html或./index2.html；**

**    在子目录：xxx/index2.html；**

**    在孙子目录：xxx/xxx/index2.html；**

**    在父目录：../index2.html；**

**    在爷爷目录：../../index2.html；**

** **

**三．锚点设置**

**    超链接也可用来将同一个文档中的另一个元素移入视野。通过属性id或name实现锚**

**点定位。**

**    //链接**

**    <ahref="\#1">第一章</a><ahref="\#2">第二章</a><ahref="\#3">第三章</a>**

**    //锚点**

**    <a name="1"></a> <a id="3"></a>**

转载于:https://www.cnblogs.com/zjltt/p/7196731.html

HTML超链接和路径

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关 HTML中的路径和超链接标签

相关 HTML-03-超链接

相关 HTML超链接标签

相关 HTML——超链接

相关 HTML：建立超链接

相关 HTML之超链接

相关第 4 章超链接和路径

相关什么是HTML超链接？锚链接？

相关 HTML超链接和路径

相关 html 超链接