HTML如何设置图片超链接,代码要怎么写?

HTML如何设置图片超链接,代码要怎么写?,第1张

你可以通过把某元素嵌套进a元素使其变成一个链接
把你的嵌套进a元素。举例如下:
<a href="#"><img src="/images/relaxing-catjpg"></a>

超链接是网页中的重要元素,超链接能使浏览者从一个页面跳转到另一个页面,实现文档和网页的互联工作。

了解超链接前还需要知道绝对路径和相对路径的概念。

绝对路径有两个缺点:

需要输入更多内容,

如果文件被移动,需要重新设置所有相关链接。

相对路径更适合网站内部链接。

相对路径使得同处站点文件夹内的相对地址可以自由在文件夹间构建连接,即使站点文件夹所在服务器发生改变,文件夹的所有内部链接都不会出现问题。 

超链接标记基本语法

<a href=”文件名”>链接元素</a>  
<a href=”URL”>链接元素</a>

1、首先使用超链接,输入代码“a”。

2、接下来需要设置元素a,根据下图中的代码进行输入。

3、然后需要设置href值,也就是需要跳转的位置,根据下图中的代码进行输入自己想要的超链接。

4、然后这样就完成了。如图所示

5、然后设置后的效果图

6、然后点击文字就可以调到百度页面了,跳转网页图如下:

可以使用input的click事件进行处理,这里假设点击转向的链接是百度,方法如下:

1、DOM0级事件处理:

1)html代码:<input name="注册" type="button" id="btn1" title="登注册" value="注册" o nclick="goToBaiDu()"/>

2)js代码:

function goToBaiDu(){

consolelog('现在去百度啦!')

windowopen('>

}

效果如下:

2、DOM2级事件,绑定click事件,如下:

1)html代码:<input name="注册" type="button" id="btn1" title="登注册" value="注册"/>

2)js代码:

windowonload = function(){

documentgetElementById('btn1')addEventListener('click',goToBaiDu)

}

function goToBaiDu(){

consolelog('现在去百度啦!')

windowopen('>

}

效果如下:

3、上面的方式的打开一个新窗口,还有一个打开链接的方式,是在当前标签页下直接跳转到另一个页面,代码如下:

windowlocationhref=">

超链接有外链接和内链接两种。下面,我们来看看怎么在制作网页中,设置超链接吧。

a标签

在HTML中一般是采用a标签来创建超链接,如下图所示:

href

a标签有href属性,表示跳转到某个链接中,如下图所示:

预览效果

然后右击网页,选择在浏览器中预览,预览效果如下图所示:

点击文字链接就会跳转到搜狗搜索的页面,如下图所示:


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/13408430.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-30
下一篇 2023-07-30

发表评论

登录后才能评论

评论列表(0条)

保存