Html读书随记4-超链接

   日期:2024-12-26    作者:ljf771015 移动:http://3jjewl.riyuangf.com/mobile/quote/56613.html

超链接随处可见,可以说是网页中最常见的元素,如绿叶学习网的导航、图片列表等都用到了超链接,只要我们轻轻一点超链接,就会跳转到其他页面

Html读书随记4-超链接

超链接,英文名是hyperlink。每一个网站都由非常多的网页组成,而页面之间通常都是通过超链接来相互关联的。超链接能够让我们在各个独立的页面之间方便地跳转。

 a标签

在HTML中,我们可以使用a标签来实现超链接。

 

href表示你想要跳转到的那个页面的路径(也就是地址

文本超链接EXP

 

效果如图

图片超链接EXP

 

效果如图

 

target属性

默认情况下,超链接都是在当前浏览器窗口打开新页面的。在HTML中,我们可以使用target属性来定义超链接打开窗口的方式。

语法

 

target的取值属性有四种,如图

一般情况下,我们只会用到“_blank”这1个值,也只要记住这一个就够了,其他3个值不需要去深究。

在HTML中,超链接有两种:一种是外部链接,另外一种是内部链接。

首先,我们建立一个网站,网站名为“website2”,其目录结构如图

 

对于图中的3个页面,如果我们在page1.html单击超链接,跳转到page2.html或者page3.html,这种超链接就是内部链接。这是因为3个页面都是位于同一个网站根目录下的。

页面2

 

锚点链接

在HTML中,锚点链接其实是内部链接的一种,它的链接地址(也就是href)指向的是当前页面的某个部分。所谓锚点链接,简单地说,就是单击某一个超链接,它就会跳到当前页面的某一部分。

EXP

 

预览效果

我们分别单击“推荐文章”“推荐音乐”“推荐电影”这3个超链接,页面就会自动滚动到相应的部分。

想要实现锚点链接,需要定义以下2个参数。目标元素的id。a标签的href属性指向该id。其中,id属性就是元素的名称,这个id名是随便起的(一般是英文)。不过在同一个页面中,id是唯一的,也就是说一个页面不允许出现相同的id。道理很简单,你见过哪两个人的身份证号码是相同的呢?最后要注意一点,给a标签的href属性赋值时,需要在id前面加上“#”(井号,用来表示这是一个锚点链接。

很好理解,小伙伴可以自己在HBuilder X里试一下。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 


特别提示:本信息由相关用户自行提供,真实性未证实,仅供参考。请谨慎采用,风险自负。


举报收藏 0评论 0
0相关评论
相关最新动态
推荐最新动态
点击排行
{
网站首页  |  关于我们  |  联系方式  |  使用协议  |  隐私政策  |  版权隐私  |  网站地图  |  排名推广  |  广告服务  |  积分换礼  |  网站留言  |  RSS订阅  |  违规举报  |  鄂ICP备2020018471号